HTML下拉菜單不工作在Firefox和一切都是錯誤的舊版本的IE瀏覽器

Question

晚上好，我有我的下拉菜單的Firefox和IE的麻煩。

我錯誤地開發了這個頁面並且在Chrome上測試了所有的東西，但是當一個好友爲我檢查它時，他使用了firefox並且說他無法使用我的導航。有人可以請指出我在正確的方向謝謝。

如果有人可以點我在正確的方向上讓我的網頁把眼光放在IE好，將是巨大

這裏是代碼

<nav> 
    <ul> 
    <li><a href="#">Home</a></li> 
    <li><a href="#"html">Register/login</a> 
     <ul> 
      <li><a href="register.php">Register</a></li> 
      <li><a href="login.php">Login</a></li> 
      <li><a href="#">Forgot Password</a> 
       <ul> 
        <li><a href="#">Email Password</a></li> 
        <li><a href="#">Answer Security Questions</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li> 
    <li><a href="#">Contact Us</a> 
     <ul> 
      <li><a href="#">Email</a></li> 
      <li><a href="#">Forum</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Contact Us</a> 
     <ul> 
      <li><a href="#">Email</a></li> 
      <li><a href="#">Forum</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Contact Us</a> 
     <ul> 
      <li><a href="#">Email</a></li> 
      <li><a href="#">Forum</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Contact Us</a> 
     <ul> 
      <li><a href="#">Email</a></li> 
      <li><a href="#">Forum</a></li> 
     </ul> 
    </li> 
</ul> 
</nav>   

這裏是CSS

nav { 
    height:80px; 
    width:1024px; 
    } 
ul { 
    padding:0; 
    margin:0; 
    list-style:none; 
    } 
nav ul ul { 
    display: none; 
    } 
nav ul li:hover > ul { 
    display: block; 
    } 
nav ul { 
    background: #efefef; 
    background: linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
    background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%); 
    background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); 
    box-shadow: 0px 0px 9px rgba(0,0,0,0.15); 
    padding: 0 75px; 
    border-radius: 10px; 
    list-style: none; 
    position: relative; 
    display: inline-table; 
    z-index:100; 
    } 
nav ul:after { 
    content: ""; clear: both; display: block; 
    } 
li { 
    float: left; 
    } 
nav ul li:hover { 
    background: #4b545f; 
    background: linear-gradient(top, #4f5964 0%, #5f6975 40%); 
    background: -moz-linear-gradient(top, #4f5964 0%, #5f6975 40%); 
    background: -webkit-linear-gradient(top, #4f5964 0%,#5f6975 40%); 
    } 
nav ul li:hover a { 
    color: #fff; 
    } 
nav ul li a { 
    display: block; padding: 25px 40px; 
    color: #757575; text-decoration: none; 
    } 
nav ul ul { 
    background: #5f6975; border-radius: 0px; padding: 0; 
    position: absolute; top: 100%; 
    } 
nav ul ul li { 
    float: none; 
    border-top: 1px solid #6b727c; 
    border-bottom: 1px solid #575f6a; 
    position: relative; 
    } 
nav ul ul li a { 
    padding: 15px 40px; 
    color: #fff; 
    } 
nav ul ul li a:hover { 
    background: #4b545f;} 
} 
nav ul ul ul { 
    position: absolute; left: 100%; top:0; 
    } 
li ul { 
    display: none; 
    position: absolute; 
    top: 1em; 
    left: 0; 
    } 
li > ul { 
    top: auto; 
    left: auto; 
    } 
li:hover ul, li.over ul{ display: block; } 

#article{ 
    height:500px; 
    width:1024px; 
    background:#FFFFFF; 
    } 
#article>h1 { 
    text-align:center; 
    } 
#legaljibjab { 
    height:30px; 
    width:1024px; 
    border:black solid thin; 
    background:#FFFFFF; 
    } 

Answer 1

舊版瀏覽器不支持HTML5的新樣式某些事情可能會因爲舊版支持HTML試試IE 10或Chrome而出現故障，因此可能會出現故障。你的html和css看起來是正確的，但要成爲舒爾下載一個新的瀏覽器。也請嘗試取出NAV

Answer 2

難道這是這行無效的HTML？

<a href="#"html">Register/login</a> 

Answer 3

我看到你的第二個<li>標籤在那裏隨機html標籤這可能是沒有幫助。通過html驗證器運行你的代碼將爲你創造奇蹟。快速谷歌搜索將爲您提供許多不同的選擇。

<nav>標記是一個html5標記，不支持IE8和更舊版本。我猜你的朋友可能使用的是舊版本的IE。在開發跨瀏覽器兼容性時，您需要記住一些標籤兼容性不同。有很多網站可以用來檢查。在學校裏，我經常用 - Caniuse.com

至於Firefox不工作，我真的不能說。 Firefox與<nav>標籤兼容，因此應該可以正常工作。您在瀏覽器的錯誤控制檯中是否收到錯誤？