鍍金池/ 問答/Android/ 移動端單屏適配如何做

移動端單屏適配如何做

需求:將設(shè)計(jì)稿(根據(jù)iphone6設(shè)計(jì)的)1屏顯示完畢。
問題點(diǎn):縱橫比比較大的設(shè)備(比如:iphone4,iphone5),按設(shè)計(jì)比例來顯示的話,就會出現(xiàn)顯示不完整的問題
如何解決這個痛點(diǎn)呢?

回答
編輯回答
別傷我

使用rem,我自己有個簡單的整理
根據(jù)設(shè)計(jì)圖標(biāo)注的尺寸,使用rem單位替換px單位即可

2017年7月4日 16:47
編輯回答
孤島

單屏我一般用vw和vh做單位,圖全是用背景圖

2017年8月28日 09:53
編輯回答
葬憶

單屏頁就會有這樣的痛點(diǎn),除了用rem能解決部分的設(shè)備外,還有一些比例差距很奇怪 ,甚至在一些手機(jī)自帶瀏覽器打開底部有自帶工具條的時候,一般都是用媒體查詢?nèi)メ槍σ恍┰剡M(jìn)行寬度減小,間距減小,我常用的做法是用js去判斷屏幕的可用高度/可用寬度的比例,一般在1.5以下的都是需要大調(diào)的設(shè)備,基本做不到和設(shè)計(jì)稿相同 畢竟屏幕比例都變化了

2017年5月11日 17:22
編輯回答
神經(jīng)質(zhì)

比例相差太大的情況,我是高度顯示百分百 寬度按設(shè)計(jì)稿比例算出的 兩邊會有留白,雖然不怎么完美,但如果兩邊背景弄的好的話,顯示還是比較不錯的

2018年9月2日 19:08
編輯回答
舊言

這里得具體情況具體分析了,如果你的設(shè)計(jì)稿純色(或者設(shè)計(jì)稿尾部是純色),那么可以用背景色填充,如果不是純色,而是復(fù)雜顏色,那么這種沒法處理,不管是用背景圖還是怎么的都會有圖片顯示不完整問題(把高度縮小肯定體驗(yàn)不好)

2017年8月13日 00:43
編輯回答
薄荷糖

錯了, 之前 我寫了個一屏渲染的。 貌似 用的 是 把視口高度font,作為html 里的根字體大小, 除背景圖外,
里面的頁面元素 我用 absoulte定位 + rem 定位。
假如里面 a 元素 的 (width / font) rem (height / font) rem (top / font) rem (left / font) rem
...

2017年11月14日 17:05