明霞山资源网 Design By www.htccd.com
nav导航栏
<nav role="navigation" class="navbar navbar-default">
<div class="container-fluid"></div>
<div class="navbar-header">
<a href="#" class="navbar-brand"> 大大的logo </a>
</div>
<div >
<ul class="nav navbar-nav">
<li> <a href="#" > 分类 </a> </li>
<li> <a href="#" > 分类 </a> </li>
<li> <a href="#" > 分类 <span class="caret"/> </a> </li>
</ul>
</div>
</nav>
响应式的导航栏
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button class="navbar-toggle" data-toggle="collapse" data-target="#one">
<span class="sr-only">切换导航</span>
<span class="icon-bar"/>
<span class="icon-bar"/>
<span class="icon-bar"/>
</button>
<a href="#" class="navbar-brand"> BigLogo </a>
</div>
<div class="collapse navbar-collapse" id="one">
<ul class="nav navbar-nav">
<li> <a href="#"> 分类1 </a> </li>
<li> <a href="#"> 分类2 </a> </li>
<li> <a href="#"> 分类3 </a> </li>
<li> <a href="#"> 分类4 </a> </li>
</ul>
</div>
</div>
</nav>
具有不同对齐风格和固定的导航栏
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<a href="#" class="navbar-brand"> 前端万岁 </a>
</div>
<div>
<ul class="nav navbar-nav navbar-right">
<li> <a href="#" > <span class="glyphicon glyphicon-user"/>注册</a></li>
<li> <a href="#" > <span class="glyphicon glyphicon-log-in"/>登录</a></li>
</ul>
<ul class="nav navbar-nav navbar-left">
<li> <a href="#" > <span class="glyphicon glyphicon-user"/>注册</a></li>
<li> <a href="#" > <span class="glyphicon glyphicon-log-in"/>登录</a></li>
</ul>
</div>
</div>
</nav>
面包屑导航(BreadCrumb)
<ol class="breadcrumb"> <li> <a href='#' > 首页 </a> </li> <li> <a hef="#" > Java </a> </li> <li class=active"> <a href="#"> Xxx文章 </a> </li> </ol>
层次导航,让我想起UC的极速模式的 X 级页面
以上所述是小编给大家介绍的BootStrap学习笔记之nav导航栏和面包屑导航,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
明霞山资源网 Design By www.htccd.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
明霞山资源网 Design By www.htccd.com
暂无评论...
RTX 5090要首发 性能要翻倍!三星展示GDDR7显存
三星在GTC上展示了专为下一代游戏GPU设计的GDDR7内存。
首次推出的GDDR7内存模块密度为16GB,每个模块容量为2GB。其速度预设为32 Gbps(PAM3),但也可以降至28 Gbps,以提高产量和初始阶段的整体性能和成本效益。
据三星表示,GDDR7内存的能效将提高20%,同时工作电压仅为1.1V,低于标准的1.2V。通过采用更新的封装材料和优化的电路设计,使得在高速运行时的发热量降低,GDDR7的热阻比GDDR6降低了70%。