您的位置:首页 > Web前端 > CSS

区分各浏览器的CSS hack(包含360、搜狗、opera)

2014-05-29 16:34 190 查看
固然说应用css hack来解决页面兼容性bug并不是个好办法,然则有时辰这些hack还是用的着的,比如你接管了一个二手或是三手的遗留界面,混乱无章的css代码,只在某个浏览器下有兼容bug,并且须要短时候内处理惩罚。

下面一段代码可以让你很快哄骗css来为特定的浏览器指定样式。不久不多赘述,看码即懂:

属性过滤:

_height:10px; /* IE6支撑 */

*height:10px; /* IE6、IE7支撑 */

height:10px\0/; /* IE8支撑 */

选择器过滤:

/*针对IE6*/

* html #nav{  margin:12px;  }

/*针对IE7*/

*+html #nav{  margin:11px; }

/*针对Firefox*/

@-moz-document url-prefix() {

#nav{ width:200px; }

}

IE7、Firefox共用

height: 100px !important(优先级)

/*针对Safari & Chrome* 360 搜狗/

@media screen and (-webkit-min-device-pixel-ratio:0) {

#nav{ width:300px; }

}

/*针对Opera*/

@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {

#nav{ width:400px; }

}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: