为什么我的导航栏上不显示颜色

我目前正在尝试为每个列表项目使用不同颜色的导航栏。下面是HTML代码为什么我的导航栏上不显示颜色

<ul> 
     <li id="item1"><a href="index.html">Home </a></li> 
     <li id="item2"><a href="about.html"> About </a></li> 
     <li id="item3"><a href="news.html"> News </a></li> 
     <li id="item4"><a href="video.html"> Video </a></li> 
     <li id="item5"><a href="donate.html"> Donate </a></li> 
     <li class="part"><a href="contact.html">Contact</a> </li> 
    </ul>

这里是CSS代码

#item1{background:#7375D8}; 
#item2{background:#4E51D8}; 
#item3{background:#1A1EB2}; 
#item4{background:#303285}; 
#item5{background:#080b74}; 
#header ul li.part 
{ 

    background:#689AD3; 

}

出于某种原因，仅第1项和li.part实际上是正确显示的颜色，在所有浏览器，其余什么都不显示。但是，Dreamweaver在预览部分显示所有颜色，因此我不知道问题出在他们身上。

非常感谢您的贡献。

来源

2012-03-19 Jim Mcool

您使用哪个浏览器进行测试？ – Brian 2012-03-19 18:57:59

这只是一个语法错误！分号应该放在花括号内！

#item1{background-color:#7375D8;} 
#item2{background-color:#4E51D8;} 
#item3{background-color:#1A1EB2;} 
#item4{background-color:#303285;} 
#item5{background-color:#080b74;} 
#header ul li.part 
{ 
    background-color:#689AD3; 
}

来源

2012-03-19 19:02:00 bfavaretto

有趣的是，Dreamweaver没有捕获/不关心这样的语法错误 – SupremeDud 2012-03-19 19:03:46

你还没有正确地关闭分号，它在大括号之外，所以这就是它没有工作的原因。请参阅下面的css规则以获取正确的规则。

你的CSS代码象下面这样：

#item1{background:#7375D8;} 
#item2{background:#4E51D8;} 
#item3{background:#1A1EB2;} 
#item4{background:#303285;} 
#item5{background:#080b74;} 
#header ul li.part{background:#689AD3;}

来源

2012-03-19 19:02:14 w3uiguru

半冒号应该是在大括号每个样式之前。未封闭的标签导致问题

来源

2012-03-19 19:02:19 Brian

非常感谢，它正在盯着我的脸！ – 2012-03-19 19:04:27

是的，直到我做了一个测试页，我看到发生了什么。 – Brian 2012-03-20 12:50:08

为什么我的导航栏上不显示颜色

回答

相关问题