css - 移動端為什么產(chǎn)生“一像素邊框”這個問題?
問題描述
先說下我的想法。 因為retina屏幕的物理像素密度是普通屏幕的2倍。也就是說同樣一英寸retina屏幕用兩個物理像素去渲染,而普通屏幕只用一個。至此我認為retina屏幕的物理像素它的大小是小于普通屏幕的物理像素大小的!不然數(shù)值上相等的retina屏幕和普通屏幕相比的話retina屏幕的面積豈不是普通屏幕的4倍?但現(xiàn)實中iphone并沒有比普通手機大啊。所以我覺得retina屏幕的物理像素是比普通屏幕的物理像素小。那么問題來了。既然是這樣怎么會產(chǎn)生“一像素邊框這個問題呢?”雖然retina屏幕使用兩個物理像 素去表示一個css像素,而普通屏幕是用一個物理像素去表示一個css像素,但是retina屏幕的物理 像素的大小是普通的二分之一啊。所以他們應該相等才對啊。可是這個問題確實存在,那只能說明我 的想法是錯的。可是我又不知道錯那,麻煩大牛們能給我解解惑!
問題解答
回答1:移動端的像素跟屏幕像素并不是相等的,首先跟縮放比例有關,確認是1.0的話,CSS 可以對應 document.body.clientHeight 和 document.body.clientWidth。 1920 x 1200 的屏幕,document.body 可能只有 480 x 662 的尺寸。
回答2:直接用rem布局,這個放大倍數(shù),圖片會不會模糊
相關文章:
1. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣?這個是怎么回事????2. 在應用配置文件 app.php 中找不到’route_check_cache’配置項3. html按鍵開關如何提交我想需要的值到數(shù)據(jù)庫4. css - width設置為100%之后列表無法居中5. ios - vue-cli開發(fā)項目webstrom會在stylus樣式報錯,飆紅,請大神幫忙6. javascript - 一個頁面有四個圖片,翻頁的時候想固定住某個圖片然后翻頁,如何實現(xiàn)呢?7. css3 - 怎么感覺用 rem 開發(fā)的不多啊8. html5 - 用Egret寫的小游戲,怎么分享到微信呢?9. python - 在pyqt中做微信的機器人,要在表格中顯示微信好友的名字,卻顯示不出來,怎么解決?10. objective-c - 自定義導航條為類似美團的搜索欄樣式
