首页 » 技术分享 » css不同浏览器兼容性处理

css不同浏览器兼容性处理

　
评论关闭　810次浏览

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 也不支持。

转载自原文链接, 如需删除请联系管理员。

原文链接：css不同浏览器兼容性处理，转载请注明来源！

赞 0