Html 如何在移动设备上自动将菜单栏更改为下拉列表？

我在一个桌面和移动站点上工作。我想让菜单栏在桌面站点上显示完整菜单，在移动站点上仅显示一个带有下拉菜单的按钮。有人知道怎么做吗？用bootstrap能做到吗？但是怎么做呢？请帮忙

就像这个网站。缩放浏览器，你会看到菜单按钮。

---

这很容易用引导实现

这是直接从引导文档中复制的

阅读文档。最著名的是“响应导航栏”部分

<div class="navbar">
    <div class="navbar-inner">
        <div class="container">

         <!-- .btn-navbar is used as the toggle for collapsed navbar content -->
         <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
         </a>

         <!-- Be sure to leave the brand out there if you want it shown -->
         <a class="brand" href="#">Project name</a>

         <!-- Everything you want hidden at 940px or less, place within here -->
         <div class="nav-collapse collapse">
             <!-- .nav, .navbar-search, .navbar-form, etc -->
             <ul class="nav navbar-nav">
                <li class="active"><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
                <li><a href="#">Link</a></li>
             </ul>
         </div>
      </div>
   </div>
</div>

Hi Schmalzy，谢谢你的回复。但是如果我不想使用bootstrap的ui设计，我也可以这样做吗？@SoKim如果你愿意，你可以使用这个页面来更改ui。或者简单地用您自己定制的CSS覆盖默认的引导CSS。