（1）、把邊框設定為absolute,使用after,定義寬度為1px（mixin.styl）
（2）、通過@media,判斷不同的dpi,來改變相應的y軸寬度（base.styl），定義公共class border-1px，在用到1px邊框的地方，加上border-1px
又叫物理畫素
是顯示屏能夠控制的最小顯示單位.
它就是css上用的畫素: border: 1px solid black; 它是web程式設計抽象的概念,不存在的, 它獨立於裝置, 用於在邏輯上衡量畫素
也叫密度無關畫素
用於獨立於裝置,用於邏輯上衡量畫素的單位, 也就是css畫素, 可轉換為物理畫素。
所以說，物理畫素和裝置獨立畫素之間存在著一定的對應關係。
獲取
screen.width
screen.height
是裝置上物理畫素和裝置獨立畫素(device-independent pixels (dips))的比值
通過控制整個值,可以控制頁面的放大,快捷鍵ctrl+的原理就是這個.//chrome 為1
window.devicepixelratio
移動端1px邊框實現
一看上篇博文的發布日期，就知道自己好久沒有寫技術文章了。一是可能工作比較忙，二是可能自己也比較懶散啦。今天重新敲起鍵盤。來跟大家分享乙個最近新學到的技術。一是為鞏固自己的掌握程度。也希望能幫到有需要的同學。大神看到的話可以提點意見。幫助小弟更快的成長。好了正文從這開始 如何實現在移動裝置下1畫素的邊...
實現移動端1px邊框
最近學了一下vue的實戰課程，學習到了其中的乙個頁面設計技巧，覺得深有感觸，於是便寫個部落格記錄下來，以便下次查閱 專案中是通過vue stylus來實現的，那麼首先需要說一下實現原理，因為在移動端中物理畫素是裝置畫素的兩倍，那麼以平時在pc端中設計的1px 在移動端裝置中就是2px了，那麼，我們要...
移動端1px邊框實現
手機端實現真正的一畫素邊框 border 1px,border bottom 1px,border top 1px,border left 1px,border right 1px 線條顏色 黑色 border 1px after,border bottom 1px after,border top...