这篇文章发布于 2010年09月25日,星期六,15:06,归类于 CSS相关。 阅读 92762 次, 今日 3 次 9 条评论
by zhangxinxu from http://www.zhangxinxu.com
本文地址:http://www.zhangxinxu.com/wordpress/?p=1121
IE9 测试版好像是在9月16日凌晨发布的,如今在中国,IE已经四世同堂,这是多么温馨美满的画面啊,让人不由得“喜极而泣”啊!关于IE9的野史外传这里不做讨论,本文内容正如题目所示,主要概述下目前IE9版本对CSS3的支持情况。随着时间的推移,IE9必定会做一定的改进与修复等,所以,可能仅仅几个月后,现在还不支持的CSS3属性已经支持了,所以,下文所有的表格和数据仅作参考,如果您想要比较实时权威点的数据,可以点击这里查看:
IE9对CSS3属性的支持情况
CSS3属性 | IE9支持情况 | 之前版本IE支持情况 |
---|---|---|
opacity | None | |
multiple backgrounds | None | |
background-clip | None | |
background-size | None | |
background-origin | None | |
text-shadow | — | |
word-wrap | 5-8 | |
writing-mode | 5-8 | |
border-image | — | |
border-radius | None | |
box-shadow | None | |
overflow-x | 7-8 | |
overflow-y | 7-8 | |
multiple columns | — | |
box-sizing | 8 | |
RGBA colors | None | |
HSL colors | None | |
HSLA colors | None | |
text-stroke | — | |
gradients | — | |
transforms | — | |
transitions | — | |
outline-offset | — | |
resize | — | |
@font-face | 5.5-8 |
对一些生僻属性的支持情况
下面这些属性呢,平时比较腼腆害羞,我们用的不是很多,但是,IE9对其是支持的:
@namespace, text-justify, text-align-last, text-overflow, word-break.
还有很多其他鲜为人知的CSS属性,由于现在版本的IE不支持,所以,就没有罗列出来。
IE9对CSS3选择器支持情况
见下表:
CSS3选择器 | IE9支持情况 | 之前版本IE支持情况 |
---|---|---|
[attribute^=value] | 7-8 | |
[attribute*=value] | 7-8 | |
[attribute$=value] | 7-8 | |
E ~ F (sibling) | 7-8 |
IE9支持的伪类&伪元素
- :root
- :nth-child(n)
- :nth-last-child(n)
- :nth-of-type(n)
- :nth-last-of-type(n)
- :last-child
- :first-of-type
- :last-of-type
- :only-child
- :only-of-type
- :empty
- :target
- :not(s)
- :enabled
- :disabled
- :checked
- :indeterminate
- ::selection
IE9不支持的伪类&伪元素
- :default
- :valid
- :invalid
- :in-range
- :out-of-range
- :required
- :optional
- :read-only
- :read-write
- ::before
- ::after
- ::first-letter
- ::first-line
- ::value
- ::choices
- ::repeat-item
- ::repeat-index
//zxx: 笑脸其实指的是: + o,就是冒号后面跟了个字母o,系统原因,望见谅。
我的感慨
IE9不支持border-image
属性,实在遗憾,这是个非常强大的CSS属性,潜力无限。不过,本身对IE就没报多大期待的我看到其对rgba color以及box-shadow支持有佳,也比较满足了。真如开头所说的,一些数据仅作参考,可能回老家娶个媳妇回来,一些数据就作古了。
参考文章:CSS3 Support in Internet Explorer 9
补充于2018-01-01:后来实践表明,虽然border-image
属性很强大,但是使用率相当低,当初的遗憾有些多余了。
本文为原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址:http://www.zhangxinxu.com/wordpress/?p=1121
(本篇完)
- 小tip:巧用CSS3属性作为CSS hack (1.000)
- JS护航下CSS3效果的渐进增强使用 (0.687)
- CSS3 box-shadow盒阴影图形生成技术 (0.687)
- CSS3选择器:nth-child和:nth-of-type之间的差异 (0.565)
- 获取元素CSS值之getComputedStyle方法熟悉 (0.537)
- ieBetter.js-让IE6-IE8拥有IE9+,Chrome等浏览器特性 (0.537)
- 几种纯CSS(CSS3)下的纸张效果实现展示 (0.463)
- 巧用浏览器CSS属性值的不兼容向下兼容hack技巧 (0.435)
- CSS实现兼容性的渐变背景(gradient)效果 (0.341)
- 小tip:CSS3下条纹&方格斜纹背景的实现 (0.341)
- 纯CSS实现任意格式图标变色的研究 (RANDOM - 0.028)
您好,请问IE9 及 一下的浏览器 怎么去除 input 默认的 X
鑫大大ie9下不支持input的placeholder,有什么办法?
JS模拟,LuLu ui中就有: http://l-ui.com/#content/apis/placeholder.php
可以独立使用,示意demo:http://www.zhangxinxu.com/study/201712/lulu-placeholder.html
ie9 支持 transforms …你这个表格貌似错了,和参考网站不一样额
我的博客也是,在IE下css样式显示会走样,估计是ul的属性问题。尽管ie有许多不完美,但是不得不承认,ie依然是浏览器用户最多的。
ie9下border-radius怎么不支持的
不是border-radius,是border-image.
还是不支持
:out of my mind. 🙂