-2

我最近重构了我的网站以使用 HTML5。它适用于大多数浏览器,显然除了 IE7 和 IE8。

看起来它是由于使用了 IE7 显然忽略的 <header>、<section> 和 <article> 标签造成的。我的 css 为这些定义了特定的标签格式子类。

header { color: #fff;  background: url("background1.jpg"); 
        padding: 10px 40px 20px 40px; margin-bottom: 20px; }
header a { color: #fff; text-decoration: none; outline: none; }
header a:hover { color: #fff; text-decoration: underline; }
header h1 { color: #FFFFFF; font-weight: bold; font-size: 30px; 
          padding-bottom: 20px; padding-top: 0px; }
header h2 { color: #FFFFFF; font-weight: bold; font-size: 16px; padding-bottom: 10px; }
header hr { margin: 10px 10px 0px 0px; }
header .copyright { font-style: italic; font-weight: bold; 
    padding-left: 30px; padding-right: 0px; }

section { padding: 5px 40px 5px 40px; line-height: normal; }

article .main { font-weight: bold; font-size: 20px; line-height: normal; }

我跳过了其他不会导致问题的样式定义。

我怎么能解决这个问题?我必须删除 HTML5 标签吗?

4

3 回答 3

6

您可以在 head 部分中使用此脚本:

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

大多数 html5 对我来说是否在 IE 中工作:-)

于 2012-07-18T10:26:15.743 回答
0

问题是浏览器对它们根本无法识别的标签进行了特殊处理。诸如应用样式和能够包含子项之类的基本内容将不起作用。

Html shivs,例如由 RTB 链接的,将通过 javascript 注入对这些 html5 标签的基本识别,以便浏览器将它们识别为有效标签,这意味着您可以设置它们的样式。

Modernizr 之类的库还包括一个 html5 shiv(除此之外,Modernizr 不启用 html5 功能)请注意,除了基本的标签识别之外,shiv 通常不允许任何其他操作,因此您可以设置元素的样式。它不启用功能。

于 2012-07-18T10:32:05.463 回答
0

您可以尝试在 javascript 中创建元素,IE 将呈现它。

document.createElement('header');
document.createElement('section');
document.createElement('article');
于 2012-07-18T10:37:18.263 回答