您的位置:首页 > 其它

关于IE的几个兼容

2014-09-04 18:09 169 查看
1.display:inline-block

这个熟悉比较常用,但是IE浏览器的兼容就不好,

IE浏览的兼容办法:*display:inline; zoom:1;

2.margin:0 auto;

水平居中,单在IE中无效,

兼容方法:需要在居中的层的父类中加上

*text-align:center;


3.让IE兼容HTML5

<!-–[if lt IE 9]><script src=" http://html5shiv.googlecode.com/svn/trunk/html5.js "></script ><![endif]–- >
但要用,都要初始化新标签的CSS,因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局
在css里面添加:

/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}

但是如果ie6/7/8 禁用脚本的用户,可以参照facebook的做法,即引导用户进入带有noscript标识的 “/?_fb_noscript=1”页面,用 html4 标签替换 html5 标签,

<!--[if lte IE 8]>
<noscript>
<style>.html5-wrappers{display:none!important;}</style>
<div class="ie-noscript-warning">您的浏览器禁用了脚本,请<a href="">查看这里</a>来启用脚本!或者<a href="/?noscript=1">继续访问</a>.
</div>
</noscript>
<![endif]-->

html5shiv官方网址:http://code.google.com/p/html5shiv/
参考:http://www.jb51.net/html5/22826.html  ; http://www.codefans.net/articles/324.shtml


4.IE兼容 css3属性等

前提:下载ie-css3.htc

用法:在用的css3的规则里面添加

behavior: url(ie-css3.htc);


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

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

border-radius为元素四个角设置圆角属性
元素边框
只设置一个角落的圆角属性
box-shadow模糊大小参数
偏移值
不支持除了黑色(#000)以外的其他颜色
text-shadow模糊大小参数
偏移值
颜色值
IE下的表现与Firefox/Safari/Chrome有一点点的差异,原因不详

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