前端 - 设计稿为1080*1920，适配多种移动设备，不用rem，怎么写？

Question

问题是这样的，设计师给我的是1080宽的设计稿，某个元素宽度为944，那么我该写多少px才能适配多种设备(安卓,ios)呢？不用rem。

Answer 1

為啥有這奇怪需求。 。 。 rem實際效果就是px啊。 。 。不用rem還非要用px寫。 。 。 。
解：@media 一個尺寸一個尺寸的寫

Answer 2

啊，又是一個被無知設計師坑的前端朋友啊，心疼1秒鐘。
設計稿這個尺寸，你以為用了rem就能拯救你嗎。

首先，1080*1920的尺寸，是給Android或是iOS開發的設計稿尺寸，而不會給我們前端開發的尺寸。
如果你夠有底氣，你可以要求設計重新按照我們前端的尺寸來設計。
那就是嚴格依照iphone6的2倍尺寸，也就是寬度為750，高度隨意。
但是看起來你也不是夠強勢 ~ ~

那就自己折磨自己，用折衷的方式來解決吧。 [適配效果會很差]

方式1：
保留375/1080 ，這個比值，就是實際尺寸與設計稿尺寸的比
假如你的這個元素的實際尺寸為x，你量出來的尺寸為944，那麼就有x/944 = 375/1080 = 呵呵
所以，你慢慢算吧~ ~

方式2：
自己動手把設計稿在PS中修改成寬度750，或者保存一張設計稿的圖片，然後丟在一個750寬度的設計稿裡，再量尺寸
這樣，假如你量出來的元素尺寸為y，實際尺寸為x，那麼計算就簡單很多了x/y = 375/750 = 0.5

最後

行動端的頁面，在尺寸上，只有寬度從320px到580px的區別，不用太在意是Android還是iOS
** 如果該頁面沒有展示在pc端的必要，那麼就用rem吧，只是移動端的話並不需要使用媒體查詢。
而且媒體查詢會導致工作量劇增。慎重使用。 **
如果你不用rem，那就要在響應式上有一定功底才行，多用百分比，多用彈性盒模型，多考慮如何自適應

Answer 3

用ps等比縮小設計稿
https://segmentfault.com/a/11...
往下翻有地方說明了。

Answer 4

淘寶的自適應方案 lib-flexable.js
還有一個加hotcss.js這個玩意，和淘寶的那個差不多

Answer 5

麻煩給設計一巴掌。 PC跟行動端稿子可以說是不能互用，最好是有行動端設計稿

Answer 6

我家的前端都是用media來自適應的,一張頁面適應於不同設備,通常也就那些個常用寬高.至於em,rem,px這些其實無差,只不過是有些矯情的設計師非得推一堆道理罷了.