css不同瀏覽器相容性處理
阿新 • • 發佈:2019-01-29
1,設定文字不可選:
{
-moz-user-select:none;/*火狐*/
-webkit-user-select:none;/*webkit瀏覽器*/
-ms-user-select:none;/*IE10*/
-khtml-user-select:none;/*早期瀏覽器*/
user-select:none;
}
2.去除select預設的樣式
appearance:none;
-moz-appearance:none;
-webkit-appearance:none;
3,input提示文字顏色修改
input.form-control::-webkit-input-placeholder {
color: #f00;
}
input.form-control:-ms-input-placeholder {
color: #f00;
}
4,rgba 相容 和 opacity 相容
eg:background: rgba(255,255,255,.1);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#19ffffff,endColorstr=#19ffffff);
第一部是#號後面的19 。是rgba透明度0.1的IEfilter值。
19–> 0.1
33–>0.2
4C–>0.3
66–>0.4
7F–>0.5
99–>0.6
B2–>0.7
C8–>0.8
E5–>0.9
第二部分是19後面的六位 。這個是六進位制的顏色值。要跟rgb函式中的取值相同。比如rgb(255,255,255)對應#ffffff;都是白色。
Eg:opacity:0.5;
filter:alpha(opacity=50);
-moz-opacity:0.50;
5,背景圖片適應不同螢幕
background-size: cover;//把背景影象擴充套件至足夠大,以使背景影象完全覆蓋背景區域。
背景影象的某些部分也許無法顯示在背景定位區域中。
background-position: center center//居中
瀏覽器相容:
IE 和遨遊不支援;
Firefox 新增私有屬性 -moz-background-size 支援;
Safari 和 Chrome 新增私有屬性 -webkit-background-size 支援;
Opera 不支援 background-size 屬性,新增其私有屬性 -o-background-size 也不支援。