CSS hack整理 ie浏览器兼容问题处理

2018-01-31 11:01:45来源:网络收集作者:程序诗人人点击

分享


本文转载自:http://www.cnblogs.com/PeunZhang/archive/2012/04/09/2437563.html



浏览器的兼容性一直是个头疼的问题,使用“欺骗”技术可使各个浏览器效果一致,花了些时间整理了各个浏览器的hack,主要包括ie系列和最新版本的Chrome、Safari、Firefox、 Opera,比较全面的记录下Hack,内容包括3部分:媒体查询 hack、属性Hack、选择器Hack,这些Hack已经测试并得到有效运用,有需要的同学可以放心使用,笔者会在以后不断的更新,如果有需要补充或者修改的,欢迎大家指教!



以下代码之间的空格是必要的,缺少空格导致失效



/*---------------------------------媒体查询hack [[---------------------------------*/



/* 只支持IE6、7 */



@media screen/9 {...}



 



/* 只支持IE8 */



@media /0screen {...}



 



/* 只支持IE6、7、8 */



@media /0screen/,screen/9 {...}



 



/* 只支持IE8、9、10 */



@media screen/0 {...} 



 



/* 只支持IE9、10 */



@media screen and (min-width:0/0) {...} 



 



/* 只支持IE10 */



@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {...} 



 



/* 支持IE9、Chrome、Safari、Firefox、 Opera */



 



@media all and (min-width:0){...} 



 



/* 只支持wekit内核浏览器Chrome、Safari */



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



 



/* 只支持Opera */



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



 



 /*
只支持Firefox */



@-moz-document
url-prefix() {...}



 如:


CSS hack整理 ie浏览器兼容问题处理

最新文章

123

最新摄影

闪念基因

微信扫一扫

第七城市微信公众平台