移動專案開發中，安卓或者ios等高解析度螢幕會把1px的border渲染成2px來顯示，網上搜了一下，解決方法如下：
這個主要利用after偽類進行縮放。呼叫公共class，還是很方便的。
if (window.devicepixelratio && devicepixelratio >= 2) document.body.removechild(testelem);
}
.hairlines .box {}
目前在用這個方法，使用很方便，無須多餘的class，可惜支援的不是很好，ios8+以上才可以。
-webkit-box-shadow:0 1px 1px -1px rgba(0, 0, 0, 0.5);
最先用的就是這個方法，ios沒問題。很多安卓機顯示就是坨翔，黑乎乎的描邊。。
.border
也能實現效果，使用很不方便
.border-image
顯示效果有點模糊，而且萬一以後要修改個顏色，那不坑爹了。
所以，目前推薦第一種方法。
移動端開發1px邊框問題
border 1px media only screen and webkit min device pixel ratio 2 優點 可以設定單條 多條錶框。缺點 更換顏色和樣式麻煩，某些裝置上會模糊。border 1px media only screen and webkit min devi...
移動端1px邊框實現
一看上篇博文的發布日期，就知道自己好久沒有寫技術文章了。一是可能工作比較忙，二是可能自己也比較懶散啦。今天重新敲起鍵盤。來跟大家分享乙個最近新學到的技術。一是為鞏固自己的掌握程度。也希望能幫到有需要的同學。大神看到的話可以提點意見。幫助小弟更快的成長。好了正文從這開始 如何實現在移動裝置下1畫素的邊...
實現移動端1px邊框
最近學了一下vue的實戰課程，學習到了其中的乙個頁面設計技巧，覺得深有感觸，於是便寫個部落格記錄下來，以便下次查閱 專案中是通過vue stylus來實現的，那麼首先需要說一下實現原理，因為在移動端中物理畫素是裝置畫素的兩倍，那麼以平時在pc端中設計的1px 在移動端裝置中就是2px了，那麼，我們要...