CSS如何避免一個元素樣式實際一（ASP.NET）

Question

我有一個用戶菜單下拉菜單：

<ul class="dropdown-menu"> 
          <li><a href="javascript:void(0)"> Profile</a></li> 
          <li><a href="javascript:void(0)"><span class="badge badge-success pull-right">5</span> Settings </a></li> 
          <li><a href="javascript:void(0)"> Lock screen</a></li> 
          <li class="divider"></li> 

          @using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" })) 
          { 
           @Html.AntiForgeryToken() 

           <li><a href="javascript:document.getElementById('logoutForm').submit()"> Logout</a></li> 
          } 
         </ul> 

添加@Html.BeginForm打破我的下拉菜單的樣式。

我如何能避免添加額外的造型到我的下拉元素任何線索？

Answer 1

因爲你把那個傷了你的列表佈局的形式，把形式<li></li>

列表裏面已經有佈局

<ul> 
    <li></li> 
</ul> 

@html.beginform並實際呈現形式讓你的HTML看起來像

<ul> 
    <li></li> 
    <form> 
    <li><a href="#0"></a></li> 
    </form> 
</ul> 

所以改成這個

<ul class="dropdown-menu"> 
    <li><a href="javascript:void(0)"> Profile</a></li> 
    <li><a href="javascript:void(0)"><span class="badge badge-success pull-right">5</span> Settings </a></li> 
    <li><a href="javascript:void(0)"> Lock screen</a></li> 
    <li class="divider"></li> 
    <li> @using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm" })) 
     { 
      @Html.AntiForgeryToken() 
      <a href="javascript:document.getElementById('logoutForm').submit()"> Logout</a> 
     } 
    </li> 
</ul>