爲什麼我不能修改列表？

我不能修改我通過代碼中的註釋標記的列表，也不能更改應該用於操作列表的id標題菜單的背景顏色。任何人都可以告訴我的代碼有什麼問題嗎？爲什麼我不能修改列表？

<!doctype html> 
<html> 
<head> 
    <title>BBC News - HIEP</title> 

    <meta charset="utf-8" /> 
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
    <meta name="viewport" content="width=device-width, initial-scale=1" /> 
    <style type="text/css"> 
     body{ 
      margin:0; 
      font-family: Arial; 
     } 

     .fixwidth{ 
      width: 1020px; 
      margin: 0 auto; 
      padding:0; 
     } 

     .break{ 
      clear: both; 
     } 

     #container{ 

     } 

     #topbar{ 
      background-color:#7A0000; 
      width:100%; 
      height:40px; 
      color: white; 
      margin:0; 
      padding:0; 
     } 

     #logodiv{ 
      margin:0; 
      float:left; 
      border-right: 1px solid #990000; 
      padding: 0 160px 0 0; 
     } 

     #logodiv img{ 
      position: relative; 
      top:3px; 
      margin:0; 
      padding:0 10px 1px 0; 
      border-right: 1px solid #990000; 
     } 

     #topmenudiv ul{ 
      margin:0; 
      padding:0; 
     } 

     #topmenudiv li{ 
      float: left; 
      padding:10px 11px 13px 11px; 
      margin:0; 
      list-style: none; 
      border-right: 1px solid #990000; 
      font-weight:bold; 
      font-size:0.8em; 
     } 

     #searchdiv{ 
      float: left; 
      padding:7px 11px 5px 11px; 
     } 

     #searchdiv input{ 
      height: 18px; 
      width: 185px; 
      padding-left: 5px; 
      font-weight:bold; 
      color:#525252; 
      font-size:0.8em; 
      background-image:url("image/magnify.jpg"); 
      background-repeat: no-repeat; 
      background-position: right center; 
     } 

     #headerbar{ 
      margin:0; 
      padding:0; 
      background-color:#990000; 
      width:100%; 
      height:130px; 
      color: white; 
     } 

     #headerbar p{ 
      margin:0; 
     } 

     #newsheader{ 
      float:left; 
      font-size: 3em; 
      padding: 10px 0 0 0; 
     } 

     #us{ 
      font-size:0.5em; 
     } 

     #rss{ 
      margin: 35px 10px 0 0; 
      float:right; 
      font-size:0.9em; 
      font-weight:bold; 
     } 

     #rss img{ 
      height:16px; 
     { 

     #topicmenu{ /* the class that is used to manipulate the list*/ 
     } 

     #topicmenu ul{ 
      background-color:#3E0C0D; 
     } 

     #topicmenu li{ 
      list-style: none; 
     } 
    </style> 

</head> 

<body> 
    <div id ="container"> 
     <div id = "topbar"> 
      <div class ="fixwidth"> 
       <div id="logodiv"> 
        <a href="http://www.bbc.com/news/" target = _blank><img src="image/bbclogo.jpg" /></a> 
       </div> 
       <div id= "topmenudiv"> 
        <ul> 
         <li>News</li> 
         <li>Sport</li> 
         <li>Weather</li> 
         <li>Earth</li> 
         <li>Future</li> 
         <li>Shop</li> 
         <li>TV</li> 
         <li>Radio</li> 
         <li>More...</li> 
        </ul> 
       </div> 

       <div id="searchdiv"> 
        <input type = "text" placeholder ="Search"/> 
       </div> 
      </div> 
     </div> 

     <div class ="break"></div> 

     <div id="headerbar"> 
      <div class ="fixwidth"> 
       <p id ="newsheader" >NEWS <span id="us">US</span></p> 
       <div id = "rss"> 
        RSS <img src = "image/rss.jpg" /> 
       </div> 
       <div class ="break"></div> 
       <div id ="topicmenu"> <!-- the list I get trouble from--> 
        <ul> 
         <li>Home</li> 
         <li>World</li> 
        </ul> 
       </div> 

      </div> 
     </div> 
    </div> 
</body> 
</html>

來源

2014-12-24 PMH

''應該是' BBC News '。見http://www.w3.org/TR/WCAG20-TECHS/H37.html – danielnixon

''應該是像''的東西。見http://www.w3.org/TR/WCAG20-TECHS/H57.html – danielnixon

嗯，也許是因爲：

#rss img{ 
    height:16px; 
{

^應}

來源

2014-12-24 00:04:37

你的問題是有點混亂，你不能更改類「topicmenu」的背景色，因爲沒有在你的html中使用class「topicmenu」。但有一個id主題菜單...

此外，你不能正確的樣式，因爲你沒有任何結束標籤在你的#rss img {...，你應該有其#rss img {。 ...}

這裏是你的問題的工作小提琴

<http://jsfiddle.net/owjwm8uw/>

另一件事，儘量使你的代碼儘可能乾淨......避免你的ID /類和等號之間的空間，東西如：

yourid =「blabla」，它應該是yourid =「blabla」

歡呼的夥伴，前進聖誕快樂！

來源

2014-12-24 00:19:33 Nooblike

感謝您的意見。聖誕節快樂！ – PMH

爲什麼我不能修改列表？

回答

相關問題