1.Chrome自動填充的input背景為黃色: box-shadow 向框添加陰影,預設是在框外面,inset改為向內添加。 box-shadow :H水平偏移量 V垂直偏移量 B模糊尺寸 S陰影尺寸 C陰影顏色 O/I內外影; 看陰影效果,先確定陰影尺寸,再確定偏移距離。 2.input獲得焦點 ...
1.Chrome自動填充的input背景為黃色:
box-shadow 向框添加陰影,預設是在框外面,inset改為向內添加。
box-shadow :H水平偏移量 V垂直偏移量 B模糊尺寸 S陰影尺寸 C陰影顏色 O/I內外影;
看陰影效果,先確定陰影尺寸,再確定偏移距離。
input:-webkit-autofill {
-webkit-box-shadow: 0 0 0px 100px white inset !important; //不能為transparent的任意顏色,利用內部陰影遮住瀏覽器預設的黃色背景
box-shadow: 0 0 0px 100px white inset !important;
}
2.input獲得焦點時的藍色邊框
利用元素的輪廓屬性(不占長寬空間),outline: none;即可。