css導航菜單不按預期方式顯示

此菜單顯示我希望如何在Dreamweaver CS6上進行實時查看。css導航菜單不按預期方式顯示

當我在任何瀏覽器中查看它不是應用css的部分，我不明白爲什麼？

這是HTML：

<div id="header" class="clear"> 

    <ul id="nav"> 
      <li<a href="#">REHABS</li></a> 
      <li<a href="#">BUSES</li></a> 
      <li<a href="#">TESTIMONIES</li></a> 
      <li<a href="#"><img src="images/logo.png"/></li></a> 
      <li<a href="#">SCHOOLS</li></a> 
      <li<a href="#">EVENTS</li></a> 
      <li<a href="#">FUNDING</li></a> 
    </ul>

和CSS：

#header { 
height: 100px; padding: 20px 0 0 0; width: 960px; margin: 0 auto;

}

#header ul#nav { 
list-style: none; margin: 30px auto;

}

#header ul#nav li { 
    float: left; padding: 0 0 0 20px; margin: 0 15px 0 0; 
} 

#header ul#nav a img {position:relative; bottom:35px; margin: 0 0 80px 0;} 

    #header ul#nav li:first child { background:none; } 

     #header ul#nav li a { 
      font-size: 21px; color: #e9e9e9; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; text-decoration: none; font-weight: bold; 
     } 

      #header ul#nav li a:hover, #header ul#nav1 li a.active { 
       color: #4eb1ba; 
      }

任何幫助，將不勝感激:)

來源

2013-04-24 ricky

Web開發101：切勿使用Dreamweaver中預覽您的文檔，或使用所見即所得的編輯器（希望你不是）。這就是說，看看你的HTML結構。你的LI沒有正確編碼，每個人都缺少一個> – Michael 2013-04-24 15:40:11

除了下面的答案之外，我剛剛注意到你已經有了'a.active'（一個類名）而不是'a：active'（一個僞類）在你的最後一塊CSS。你需要僞類。 – 2013-04-24 16:08:10

你不關閉你的開放<li>和你的築巢是無效的（你關閉你的</a>後收盤</li>時，它應該是周圍的其他方法 - 嘗試更改爲：

<div id="header" class="clear"> 

<ul id="nav"> 
     <li><a href="#">REHABS</a></li> <!-- You had <li instead --> 
     <li><a href="#">BUSES</a></li> 
     <li><a href="#">TESTIMONIES</a></li> 
     <li><a href="#"><img src="images/logo.png"/></a></li> 
     <li><a href="#">SCHOOLS</a></li> 
     <li><a href="#">EVENTS</a></li> 
     <li><a href="#">FUNDING</a></li> 
</ul>

你的CSS看起來不錯，所以我假設這是你的問題。

來源

2013-04-24 15:37:53 Adrift

這個標籤嵌套不正確，只是爲了讓你知道... – 2013-04-24 15:44:01

噢，我現在看到它 - 謝謝指出！固定 – Adrift 2013-04-24 15:45:45

不用擔心，可以自己編輯它我自己，但是當你的代表>我的代表它只是不會覺得正確:-) – 2013-04-24 15:47:34

你也應該有你的L1標籤內錨

<li><a href="#">TESTIMONIES</a></li>

來源

2013-04-24 15:46:47 Jag

css導航菜單不按預期方式顯示

回答

相關問題