使下拉母鏈接對於較小的設備可點擊，並在Bootstrap中隱藏下拉菜單

Question

我正在使用HTML5和CSS3以及使用Bootstrap 3.2的網站。

我有桌面視圖中購物車項目的下拉菜單。但是，我需要刪除此小型移動設備的下拉菜單，並使購物車鏈接可點擊。

目前，購物車鏈接是不可點擊的，因爲它是打開下拉單擊！

任何人都可以建議我該如何解決這個問題？

Answer 1

實際上，你可以容納兩個屬性的CART

這並不在移動

<div class="hidden-xs dropdown"> 
    <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown"> 
     Cart 
     <span class="caret"></span> 
    </button> 
... 
</div> 

顯示下一行持有的鏈接，這並不在任何桌面屏幕/小屏幕顯示（片劑）

<a class="hidden-sm hidden-md hidden-lg" href="cart">Cart</a> 

我希望這需要什麼。

Answer 2

試試這個：

CSS：

@media (max-width: 767px) { 
      .dropdown-menu { 
       display: block; 
      } 
     } 

     /* Landscape phones and smaller */ 
     @media (max-width: 480px) { 
      .dropdown-menu { 
       display: block; 
      } 
     } 

HTML：

<div class="dropdown"> 
      <a href="#" class="dropdown-toggle hidden-xs" data-toggle="dropdown">Dropdown <span class="caret"></span></a> 
      <ul class="dropdown-menu" role="menu"> 
       <li><a href="#">Action</a></li> 
       <li><a href="#">Another action</a></li> 
       <li><a href="#">Something else here</a></li> 
       <li class="divider"></li> 
       <li><a href="#">Separated link</a></li> 
       <li class="divider"></li> 
       <li><a href="#">One more separated link</a></li> 
      </ul> 
     </div> 

DEMO