jQuery Mobile的回流的NavBar

Question

嗨，我有这样的导航栏：

<div data-role="navbar" data-theme="c" > 
      <ul> 
       <li> 
        <a href="#page1" data-transition="fade" data-theme="b" data-icon=""> 
         text 
        </a> 
       </li> 
       <li> 
        <a href="#page1" data-transition="fade" data-theme="b" data-icon=""> 
         text 
        </a> 
       </li> 
       <li> 
        <a href="#page1" data-transition="fade" data-theme="b" data-icon=""> 
         text 
        </a> 
       </li> 
       <li> 
        <a href="#page1" data-transition="fade" data-theme="b" data-icon=""> 
         text 
        </a> 
       </li> 
      </ul> 
     </div> 


</div> 

我需要添加一个按钮“菜单”如果设备的屏幕小了显示三个按钮。

事情是这样的：http://img30.imageshack.us/img30/8634/o6c5.png

我知道我需要一个规则添加到CSS，但我并不怎么 请，谢谢您

Answer 1

你可以看看他们是如何做到这一点在Twitter的引导。基本上你会有一个特定屏幕大小的媒体查询，并以这种方式格式化页面。

其实，你为什么不只是整合Twitter的引导，你会得到一切你可能会遇到：http://getbootstrap.com/

检查出来，它有你想要的一切/需要。