jquery css html-下面是頭部的代碼，頭部導航切換樣式不變，誰來看看是怎麼回事

下面是頭部的代碼，頭部導航切換樣式不變，誰來看看是怎麼回事

<style type="text/css">
    * {
        margin:0px;padding:0px;top:0px;
    }
    div {margin:0px;padding:0px;
    }
  #Nav ul li {
        list-style: none;
        float: left;
        border: none;
        padding-left: 10px;
        padding-right:20px;
        background-color: #555;
        font-size: 16px;
        margin:0px;
        line-height:40px;
    }

    li:hover {
        cursor: pointer;
    }

  #Nav .cname {
        background-color: #ff7a00;
    }

   #Nav ul li a {
        text-decoration-line: none;
        color: #fff;
    }
</style>

<div  style="width:1136px;margin:0 auto;height:60px;line-height:60px;">

        <div style="float:left;display:inline;width:120px;height:60px;">
            <a href="index.html"> <img src="images/logo.png" style="border:none" /></a>
        </div>
  <div style="float:right;display:inline-block;margin-right:40px;">
      <a href='login.html' style="color:#808080" target="_blank">Login</a>
      <a href='Register.html' style="color:#808080;margin-left:10px;">register</a>

  </div>



</div>

<div style="width:100%;background:#555;height:40px;line-height:40px;"  >
    <div style="width:1136px;margin:0 auto" id="Nav">
        <ul>
            <li class="cname"><a href='index.html'>Homepage</a></li>
            <li><a href='logistics.html'>Waybill tracking</a></li>
            <li><a href='Shipping.html'>Shipping</a></li>
            <li><a href='Order.html'>Order </a></li>
            <li><a href='execution.html'>Execution</a></li>
            <li><a href='visualization.html'>Visualization</a></li>
            <li><a>Freight </a></li>
            <li><a href='http://platform.afsimba.com/'>Platform Service </a></li>
        </ul>
    </div>
</div>

$(function () { $(" ul li").click(function () { $("ul li").removeClass('cname'); $(this).addClass('cname'); }); });

最佳回答：

已經解決，把樣式放在a鏈接上面就能用