码迷,mamicode.com
首页 > 其他好文 > 详细

Bootstrap 关于导航的使用

时间:2016-06-27 19:22:12      阅读:113      评论:0      收藏:0      [点我收藏+]

标签:

如果你在使用导航组件实现导航条功能,务必在 <ul> 的最外侧的逻辑父元素上添加 role="navigation" 属性,或者用一个 <nav> 元素包裹整个导航组件。

 

导航条基于.nav

<ul class="nav nav-tabs">
  <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>

  技术分享

.nav-pills

   技术分享

垂直的话,多加个.nav-stacked

 

.disabled只改变 <a> 的外观,不改变功能

 

 

在大于 768px 的屏幕上,通过 .nav-justified 类可以很容易的让标签页或胶囊式标签呈现出同等宽度。在小屏幕上,导航链接呈现堆叠样式。

两端对齐的导航条导航链接已经被弃用了。

<ul class="nav nav-tabs nav-justified">
  ...
</ul>
<ul class="nav nav-pills nav-justified">
  ...
</ul>

  

 

Bootstrap 关于导航的使用

标签:

原文地址:http://www.cnblogs.com/xxml/p/5620852.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!