0

我在下面添加了 CSS。该网站在 Chrome、Opera 和 Firefox 中看起来不错，但在 IE 中导航看起来很糟糕。完全没有造型，看起来很糟糕。我也在我的 html 中添加了一个 html5shim。

/* NAV BAR */
#nav_bar {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 1;
background: url(../images/header-fade.gif) repeat-x;
border-bottom: 1px solid #ccc;
}

#nav_bar nav {
border-left: 1px solid #ccc;
}

    #nav_bar nav a {
display: inline-block;
width: 23%;
margin: 0;
padding: 22px 0;
text-transform: uppercase;
color: black;
text-align: center;
border-right: 1px solid #ccc;
text-decoration: none;
font: 20px "Trebuchet MS", Arial, sans-serif;
    }
4

2 回答 2

0

Have you tried to see how the CSS rules are applied to the elements in the F12 tools? They can really help you see what rules and styles are actually being applied and you can adjust them in the tool to see how it will affect your layout.

于 2013-11-12T19:58:33.080 回答
0

从您的 HTML 来看，您正在使用 HTML5nav元素。

IE8 无法识别语义 HTML5 元素，如nav, header, footer,article等section，因此您需要将其更改为 HTML4 元素（div或ul类似元素）或添加像 Modernizr 或 HTML5Shim 之类的 Javascript polyfill 以添加 HTML5 元素与旧版本的兼容性IE。

例如，在您的<head>：

<!-- html5.js -->
<!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
于 2013-11-12T15:42:17.667 回答