rgba 颜色格式
- IE8 不支持
rgba(0, 0, 0, .5)
这种颜色格式。 - 解决方案:可以利用一张半透明的 png 图片来兼容 IE8。
flexbox
- 根据 caniuse 给出的数据,IE8 是不支持
flex
布局属性的, 甚至 IE11 只支持一部分。 - 解决方案:利用
display: inline-block
/display: table
/display: inline
来实现部分兼容。 -
Almost complete guide to flexbox (without flexbox),介绍了一些不用
felx
属性来完成flexbox
布局的技术,很有参考价值,推荐。 -
Flexbox Patterns,一些利用
flex
实现常用的布局的例子,推荐参考。
HTML5
- 非常遗憾,HTML5 新增的标签在 IE8 里是不受支持滴,例如:
section
/main
/header
/footer
等。 - 解决方案:html5shiv,这个脚本可以实现兼容 IE8 。
media query
- 非常非常遗憾,IE8 也不支持
media query
。 - 解决方案:Respond.js
CSS3 新特性
- IE8 支持的 CSS3 新特性仅有 20% ,具体可以查看 caniuse 。
- 解决方案:css3pie,目前 css3pie 可以支持的功能有:
- border-radius
- box-shadow
- border-image
- multiple background images
- linear-gradient as background image
innerHTML
-
IE8 不支持 innerHTML ,如果在 IE8 中运行类似
el.innerHTML = '<div>' + content + '</div>'
的脚本时会报错如下:Unknown runtime error
可以利用这两种方法
document.createElement()
&appendChild()
,动态创建并插入到目标元素。