IE7和IE8的HTML5和CSS3

Question

我继承了一个Web应用程序,其中前端使用新的HTML5标签(标题,导航,部分标签)和新的CSS3样式属性(圆角边框).该网站在Google Chrome和Safari中看起来很棒.

但是,客户端现在抱怨IE7和IE8网站坏了.一切都不对齐,大多数样式都不呈现.

使这个网站在IE7和IE8中运行的最简单方法是什么？我是否必须:a)应用一些hack来使IE浏览器接受新的HTML5和CSS3功能？b)完全重写前端？

Answer 1

试试这个可爱的脚本(.js) :)
对于圆角,我使用另一个脚本(.htc)

使用第一个:

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

使用第二个像:

-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;
border-radius: 4px;
behavior: url(border-radius.htc);

快乐的网站建设:)

原始链接不再有效,HTML5shiv已移动.

现在可以在GitHub上找到

https://github.com/aFarkas/html5shiv

Answer 2

对于HTML5,我推荐Remy Sharp的HTML5 Shim,虽然要看到效果,但IE用户需要启用JavaScript.基本上它利用了IE6/7/8中的一个错误,它允许HTML5元素在首次使用该document.createElement函数在JavaScript中创建后被识别.

对于你的CSS,有一些不同的黑客,如CSS3 PIE使用"行为"属性(这是IE独有的)来模拟CSS3效果.我个人也没有这样做,因为根据我的经验,他们很容易打破,最终比他们的价值更麻烦.我反而倾向于编写我的CSS,以便它在IE中优雅地降级,因此圆形按钮看起来很方正,但仍然看起来不错.