移動web 1畫素邊框

2021-08-06 07:09:02 字數 649 閱讀 4961

1px縮放都0.5px的狀態下,而0.5px並不是所有都支援,再根據**查詢設定不同的縮放比例就可以了,那麼我們就開始玩兒縮放吧。

1.用height:1px的div,然後根據**查詢設定transform: scaley(0.5);

div
2.用::after::befor,設定border-bottom:1px solid #000,然後在縮放-webkit-transform: scaley(0.5);可以實現兩根邊線的需求

div

::after

3.用::after設定border:1px solid #000; width:200%; height:200%,然後再縮放scaley(0.5);優點可以實現圓角京東就是這麼實現的,缺點是按鈕新增active比較麻煩。

.div

::after

移動端1畫素邊框

通常我們會有偽類和定位來解決1畫素的問題,但是使用偽類也是有問題的,但是你可以換一種方式實現1畫素邊框的問題,box shadow 1.實現下邊框 box shadow inset 0 1px 0 0 000 2.實現右邊框 box shadow inset 1px 0 0 0 000 3.實現左邊...

小白學習web(1)

0day 為見天日的漏洞 自己挖掘出來的漏洞 指令碼 asp php jsp html css js html http協議 cms b s md5肉雞 抓雞 跳板 小馬 大馬 webshell 後門 提權 原始碼打包 脫褲 嗅探 rookit 網頁分為靜態和動態,靜態就是用html css js ...

移動WEB畫素相關知識

了解移動web畫素的知識,主要是為了切圖時心中有數。本文主要圍繞乙個問題 怎樣根據裝置廠商提供的螢幕尺寸和物理畫素得到我們切圖需要的邏輯畫素?圍繞這個問題以iphone5為例講解涉及到的web畫素相關知識。1 iphone5的相關引數 iphone 5 處理器蘋果a6處理器,1.3ghz 螢幕 四英...