3

我使用了 html 代码头类型并将 css 用于它。然后为它做一个背景。它在 google crome、mozilla、safari 中运行良好，但背景在 ie 8 from header 中不起作用。

<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ASI India Travels</title>
<style>
html, body, div, span, object, iframe, article, 
footer, header, hgroup, menu, nav, section, summary,
h1, h2, h3, h4, h5, h6, p,
time, mark, audio, video {
   margin:0;
   padding:0;
   border:0;
   outline:0;
   vertical-align:baseline;
}  
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display:block;
}
body {
  background-color:#666666;
 }
.container {
  width:875px;
  margin-left:auto;
  margin-right:auto;
}
header{ }
#header {
  background-color:#009966;
  height:275px;
}
</style>
</head>

<body>
 <header id="header">
   <div class="container">
    header
   </div>
 </header>
</body>

你能请任何人解决这个问题吗？提前致谢...

4

5 回答 5

2

您不能在 IE8 及更低版本中设置 HTML5 标记样式。

Internet Explorer <9 不知道如何在它无法识别的元素上呈现 CSS。

学到更多

你需要一个名为 html5shiv 的 Javascript polyfill。

于 2012-10-12T08:36:24.290 回答
0

这是因为你的<header>标签。您可以包含此 javascript 以在 IE 8 中使用 HTML5 标签

<script type="text/javascript">
 document.createElement('header');
</script>

希望这会有所帮助

于 2012-10-12T08:37:58.330 回答
0 
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ASI India Travels</title>
<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--> 
<style>
html, body, div, span, object, iframe, article, 
footer, header, hgroup, menu, nav, section, summary,
h1, h2, h3, h4, h5, h6, p,
time, mark, audio, video {
   margin:0;
   padding:0;
   border:0;
   outline:0;
   vertical-align:baseline;
}  
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section { 
    display:block;
}
body {
  background-color:#666666;
 }
.container {
  width:875px;
  margin-left:auto;
  margin-right:auto;
}
header{ }
#header {
  background-color:#009966;
  height:275px;
}
</style>

</head>

<body>
 <header id="header">
   <div class="container">
    header
   </div>
 </header>
</body>

您必须在文档中支持 html5 标签。在这种情况下，您的 usingheader标记是一个 html5 元素。

您可以通过访问此站点找到有关 html5 的更多信息。

看看jsFiddle 例子

于 2012-10-12T08:32:23.777 回答
0

尝试这个：

background-color:#xxxxx\0/;

把这"\0/"是 IE8 中的黑客之一，您可以使用此链接获取更多信息：IE Hacks

于 2012-10-12T08:32:29.677 回答
0

你需要做两件事：

  1. 添加一个脚本（modernizr），为 IE8 制作这个 html5 元素。你必须下载脚本
  2. 添加 CSS 以制作块级元素（您已经准备好了）

将此添加到您的<head>

<script src="js/modernizr-1.7.min.js"></script>

然后你可以在你的 CSS 中使用：

 header{
  background-color:#009966;
  height:275px;
于 2012-10-12T08:49:28.830 回答