August 08,2016
0
CSS
AI 摘要
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
以上
以上就是我在实践项目中遇到的 IE8 兼容性问题以及我自己的解决方案。如果你有更好的解决方案或者 IE8 兼容性问题,欢迎讨论:https://www.gitbook.com/book/coderfe/notes/discussions