Bootstrap前端必学入门响应式框架。如今已经推出V4版本。
何为响应式，就是在不同分辨率，情况下CSS显示不同的样式。
在head中添加如下，移动设备优先。1
<meta name="viewport" content="width=device-width, initial-scale=1.0">
在CSS添加如下，在宽度小于768px下使用的CSS样式。当然一般情况框架的上面都帮你写好了。
可能在某些移动端的时候可能会出现一些怪样子。所以要微调下。就在下面中添加。1
2
3@media (max-width: 768px) {
}
然后就是各种class标签对应的显示响应式样式了。
随便举个例子：
如下class="nav nav-pills">。nav就是导航，nav-pills为导航栏样式。
当然导航栏有很多样式的。1
2
3
4
5<ul class="nav nav-pills">
<li role="presentation" class="active"><a href="#">Home</a></li>
<li role="presentation"><a href="#">Profile</a></li>
<li role="presentation"><a href="#">Messages</a></li>
</ul>
我自己些了一个，可以看看啊。肯UI不是太好但是该有的都有
添加个小功能用jquery添加个点击导航栏跳转所有到对应的标签页。