當你給乙個div這樣的css樣式後 邊框寬度為1px
.border
height 50px
width 50px
margin 0 auto
background pink
margin-top 20px
border 1px solid red
這就是經典的1px問題，下面貼出我的解決方案。網上栗子很多，可自行尋找
.scale_1px
.scale_1px:after
為什麼？
物理畫素
又稱裝置畫素，指裝置能控制顯示的最小物理單位，只顯示器上的乙個個點
從螢幕在工廠生產出的那天起，它上面裝置畫素點就固定不變了，和螢幕尺寸大小有關，單位 pt。
邏輯畫素（dip）
css樣式**使用的就是邏輯畫素，指的是viewport中的乙個小方格。
如果在乙個裝置中，物理畫素與邏輯畫素相等，則邏輯=物理。但是，在iphone 4以上中，物理畫素是640px960px，而邏輯畫素數為320480px。因此，需要使用大約4個物理畫素來顯示乙個css畫素
畫素比
物理畫素/邏輯畫素所以，1px的邊框在iphone6顯示只是1px的css畫素 4個物理畫素，為實現真正1px需要縮小1倍，如果手機的dpr為3 則縮小0.333 …
移動端1px問題
在移動端頁面中設定邊框為1px時，在有的裝置中可能會發現邊框比1px要粗即1培訓1px 1px 裝置畫素比dpr 裝置畫素 css畫素 某一方向上 當dpr為2時1px實際為2px iphone6 dpr為3時1px為3px inphoex 所有看起來1px就會變粗 ios8下已經支援帶小數的px值...
移動端1px問題
在高清屏下，移動端的1px 會很粗。那麼為什麼會產生這個問題呢？主要是跟乙個東西有關，dpr devicepixelratio 裝置畫素比，它是預設縮放為100 的情況下，裝置畫素和css畫素的比值。window.devicepixelratio 物理畫素 css畫素目前主流的螢幕dpr 2 iph...
1px畫素的問題
之前有學習過這個問題，但是一時之間沒想起來。其實就是沒有徹底弄懂，不然怎麼會想不起來呢 物理畫素 裝置螢幕實際擁有的畫素點。比如iphone 6的螢幕在寬度方向有750個畫素點，高度方向有1334個畫素點，所以iphone 6 總共有750 1334個物理畫素。邏輯畫素 邏輯畫素是乙個抽象概念，是乙...