導航鏈接不可點擊

Question

我無法點擊導航欄上的鏈接。我已經在網上查到了任何地方，我發現人們已經參考了我所做過的類似於href的鏈接。

<div class="Navigation"> 
      <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server"> 
       <ul> 
        <li><a href="SplashPage.aspx"></a> Home</li> 
        <li><a href="Customer/Register.aspx"></a>Register</li> 
        <li><a href="Customer/Login.aspx"></a>Login</li> 
        <li>Customer 
         <ul> 
          <li> <a href="Customer/HomePage.aspx"></a>Make an Order</li> 
         </ul> 
        </li> 
        <li>Employee 
         <ul> 
          <li><a href="Employee/Modifications.aspx"></a>Modify Menu</li> 
          <li><a href="Employee/PaymentStatus.aspx"></a>Payment Status</li> 
          <li><a href="Employee/Reports.aspx"></a>Report</li> 
         </ul> 
        </li> 
       </ul> 
       <br /> 
       <br /> 
       <br /> 
      </asp:ContentPlaceHolder> 
     </div> 

下面是CSS。我不知道如果在css中任何可能影響我能點擊你的代碼工作的聯繫

ul { 
    list-style: none; 
} 

li { 
    background-color: yellow; 
    width: 150px; 
    height: 30px; 
    text-align: center; 
    float: left; 
    color:black; 
    position:relative; 
    border-radius:10px; 
} 
/*when you hover over the link it is green*/ 
    li:hover { 
     background-color:greenyellow; 
    } 
/*adjust the submenus*/ 
* { 
    margin:0px; 
    padding:0px; 
} 
/*hide submenus*/ 
ul ul{ 
    display:none; 
} 

/*when submenus are hovered over they are white*/ 
ul li li:hover { 
    background-color:white; 
} 
/*make submenus appear when thier parent menu is hovered over*/ 
ul li:hover > ul { 
    display:block; 
} 
ul ul ul { 
    margin-left:150px; 
    top: 0px; 
    position:absolute; 
} 

Answer 1

，但你有所有的導航文本坐在a（錨）標籤之外的某些原因。

您當前的鏈接看起來像這樣：

<a href="SplashPage.aspx"></a> Home 

鏈接應該是：

<a href="SplashPage.aspx">Home</a> 

檢查下面的代碼：

ul { 
 
    list-style: none; 
 
} 
 

 
li { 
 
    background-color: yellow; 
 
    width: 150px; 
 
    height: 30px; 
 
    text-align: center; 
 
    float: left; 
 
    color:black; 
 
    position:relative; 
 
    border-radius:10px; 
 
} 
 
/*when you hover over the link it is green*/ 
 
    li:hover { 
 
     background-color:greenyellow; 
 
    } 
 
/*adjust the submenus*/ 
 
* { 
 
    margin:0px; 
 
    padding:0px; 
 
} 
 
/*hide submenus*/ 
 
ul ul{ 
 
    display:none; 
 
} 
 

 
/*when submenus are hovered over they are white*/ 
 
ul li li:hover { 
 
    background-color:white; 
 
} 
 
/*make submenus appear when thier parent menu is hovered over*/ 
 
ul li:hover > ul { 
 
    display:block; 
 
} 
 
ul ul ul { 
 
    margin-left:150px; 
 
    top: 0px; 
 
    position:absolute; 
 
}

<div class="Navigation"> 
 
      <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server"> 
 
       <ul> 
 
        <li><a href="SplashPage.aspx">Home</a></li> 
 
        <li><a href="Customer/Register.aspx">Register</a></li> 
 
        <li><a href="Customer/Login.aspx">Login</a></li> 
 
        <li>Customer 
 
         <ul> 
 
          <li> <a href="Customer/HomePage.aspx">Make an Order</a></li> 
 
         </ul> 
 
        </li> 
 
        <li>Employee 
 
         <ul> 
 
          <li><a href="Employee/Modifications.aspx">Modify Menu</a> </li> 
 
          <li><a href="Employee/PaymentStatus.aspx">Payment Status</a></li> 
 
          <li><a href="Employee/Reports.aspx">Report</a></li> 
 
         </ul> 
 
        </li> 
 
       </ul> 
 
       <br /> 
 
       <br /> 
 
       <br /> 
 
      </asp:ContentPlaceHolder> 
 
     </div>

Answer 2

將您的鏈接文本放置在您的定位標記中！

<div class="Navigation"> 
      <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server"> 
       <ul> 
        <li><a href="SplashPage.aspx">Home</a> </li> 
        <li><a href="Customer/Register.aspx">Register</a></li> 
        <li><a href="Customer/Login.aspx">Login</a></li> 
        <li>Customer 
         <ul> 
          <li> <a href="Customer/HomePage.aspx">Make an Order</a></li> 
         </ul> 
        </li> 
        <li>Employee 
         <ul> 
          <li><a href="Employee/Modifications.aspx">Modify Menu</a></li> 
          <li><a href="Employee/PaymentStatus.aspx">Payment Status</a></li> 
          <li><a href="Employee/Reports.aspx">Report</a></li> 
         </ul> 
        </li> 
       </ul> 
       <br /> 
       <br /> 
       <br /> 
      </asp:ContentPlaceHolder> 
     </div> 

如果要刪除默認的鏈接樣式，只是針對<a>標籤：

a{ 
    text-decoration: none; 
    color: black; 
}