css nav ul无法正常工作

时间:2011-04-14 15:04:26

标签: html css html5

我创建了一个新网站,我的问题是FF和其他浏览器的菜单没问题,但IE浏览器没有。

问题是,它不会列出列表元素,没有悬停,没有颜色,也没有内联。

这是代码

nav {
    margin-top: 15px;
}

nav ul {
    position: relative;
    left: 297px;

}

nav li  {
    float: left;
    padding: 0 20px;
    font-size: 12px;
    line-height: 65px;
    background: url(images/line.png) no-repeat right 10px;
    height: 72px;
    text-transform: uppercase;

} 

nav li a {
    color: #656464;
    text-decoration: none;
    display: block;
}

nav li:hover {
    background: url(images/hover.png) repeat-x 0 35px;
    color: #242424;
}
可以请某人给我一个暗示吗?

2 个答案:

答案 0 :(得分:5)

nav是一个HTML5元素;旧IE将无法识别它,因此不会应用您的样式。

要让IE识别HTML5标记,请在页面上放置HTML5 shiv,然后为nav和您使用的任何其他HTML5元素声明规则,为其提供display: block样式,在您现在拥有的CSS之上。

答案 1 :(得分:1)

<nav>可以在页面上使用,但是当您尝试设置样式时会遇到问题,因为许多浏览器只是在他们不理解标签时跳过标记。

<nav>标记包装在包装器div中并替换样式,并从语义标签中删除任何样式,使它们裸露。