IE6/IE7/IE8浏览器支持CSS3

       很多前端WEB效果在主流浏览器是没有问题的，我们现在写代码都爱用CSS来解决原本需要用JS、jQuery的效果。网站设计希望在SEO方面表现优秀就减少JS的依赖，这是因为这些文件都比较大，影响加载时间。而浏览器兼容性也是一个麻烦事，其实只要习惯了，开发难度就会减少许多，比如：采用通用性好的HTML标签；判断用户的浏览器而外调用不同的CSS、JS等方法，避免全部都加载等方法都值得大家研究。

       比如网页的自适应页面，设计元素在不同的设备浏览或者用户改变了浏览器可视宽度的CSS样式的过度改变就用到CSS3的过度效果，但是IE家族的浏览器就不那么友好了，解决办法还是有，先下载一个文件

链接：http://pan.baidu.com/s/1nv5jh1J 密码：uri6

       把ie-css3.htc下载下来，htc只有IE才认它，至于工作原理就不啰嗦了，SEOer只解决用户体验问题就行了，感兴趣的也不拦着你去研究。

使用方法

.box {
  -moz-border-radius: 15px; /* Firefox */
  -webkit-border-radius: 15px; /* Safari 和 Chrome */
  border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */

  -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
  -webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */
  box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */

  behavior: url(ie-css3.htc); /* 通知IE浏览器调用脚本作用于'box'类 */
}

问题和必要的说明

       毕竟不是浏览器自带的属性，使用时遇到问题在所难免，这里说一下一些注意事项，也可以说是方法的局限性吧：

1.当前元素一定要有定位属性，像是position:relative或是position:absolute属性。

2.z-index值一定要比周围元素的要高；

转载请注明来源网址：https://www.mubanyun.com/news/1330.html