Bootstrap响应式导航
<nav class="navbar navbar-default" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse"
data-target="#example-navbar-collapse">
<span class="sr-only">切换导航</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">菜鸟教程</a>
</div>
<div class="collapse navbar-collapse" id="example-navbar-collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#">iOS</a></li>
<li><a href="#">SVN</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
Java <b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="#">jmeter</a></li>
<li><a href="#">EJB</a></li>
<li><a href="#">Jasper Report</a></li>
<li class="divider"></li>
<li><a href="#">分离的链接</a></li>
<li class="divider"></li>
<li><a href="#">另一个分离的链接</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
Bootstrap响应式导航的更多相关文章
- bootstrap 响应式导航条模板(含下拉菜单,弹出框)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Bootstrap之响应式导航栏
代码: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8 ...
- Bootstrap组件之响应式导航条
响应式导航条:在PC和平板中默认要显示所有的内容:但在手机中导航条中默认只显示“LOGO/Brand”,以及一个“菜单折叠展开按钮”,只有单击折叠按钮后才显示所有的菜单项. 基础class: .nav ...
- bootstrap固定响应式导航
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.2.0/css/bootstrap. ...
- Bootstrap学习笔记(8)--响应式导航栏
说明: 1. 响应式导航栏,就是右上角的三道杠,点一下下方出现隐藏的导航栏.如果屏幕够大就显示所有的导航选项,如果屏幕小比如手机,就显示部分,剩下的放到三道杠里隐藏. 2. 外面套一个大的div,其实 ...
- 第二百五十节,Bootstrap项目实战--响应式导航
Bootstrap项目实战--响应式导航 学习要点: 1.响应式导航 一.响应式导航 基本导航组件+响应式 第一步,声明导航区域,设置导航默认样式,设置导航条固定在顶部navbar样式class类,写 ...
- Bootstrap历练实例:响应式导航(带有表单)
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap历练实例:响应式导航
<!DOCTYPE html><html lang="zh-cn"><head><meta http-equiv="Conten ...
- Bootstrap历练实例:响应式导航栏
响应式的导航栏 为了给导航栏添加响应式特性,您要折叠的内容必须包裹在带有 classes .collapse..navbar-collapse 的 <div> 中.折叠起来的导航栏实际上是 ...
随机推荐
- Ecplise 快捷键笔记
1.显示出这个方法被哪些方法调用(Ctrl+Alt+H) 选中方法名,点右键,选“open call hierarchy”,其快捷键“Ctrl+Alt+H”,Eclipse就会显示出这个方法被哪些方法 ...
- c++ stl sort
两者相等时,必须为false. 满足拟序. 群里大佬666.
- R: 修改镜像、bioconductor安装及go基因富集分析
1.安装bioconductor及go分析涉及的相关包 source("http://bioconductor.org/biocLite.R") options(BioC_mirr ...
- linux:提取匹配含有小数点的数字(grep函数)
学艺不精,一开始用了 “grep -ne '46.5743' file.txt” 提取含有46.5743的小数不成功,后面查资料才知道正则表达式中,小数点代表的是:一定有一个任意字节. 正确的写法应该 ...
- 第五节,TensorFlow编程基础案例-session使用(上)
在第一节中我们已经介绍了一些TensorFlow的编程技巧;第一节,TensorFlow基本用法,但是内容过于偏少,对于TensorFlow的讲解并不多,这一节对之前的内容进行补充,并更加深入了解讲解 ...
- javase的网络编程(InetAddress,UDP,TCP,URL,Socket,DatagramSocket)
通过一段时间对java网络编程相关内容的学习,写下这篇随笔,对这一部分的知识进行梳理和总结. 网络编程 一.网络编程三要素: IP地址:网络会给每个联网的主机分配一个数字的编码地址,该地址就是IP地址 ...
- Git学习笔记——搭建远程仓库
有空再把笔记移上来 注意点:git remote add origin不是相对于所有git仓库,只相对于当前git仓库 心得:远程建立裸仓库,意味着我不应该直接操作远程仓库.如果我是管理员,我应该先p ...
- ngnix FastCGI解析漏洞
漏洞描述: Nginx默认是以CGI的方式支持PHP解析的,普遍的做法是在Nginx配置文件中通过正则匹配设置SCRIPT_FILENAME.当访问http://192.168.1.103/phpin ...
- SQL Server 经典案例
1.先进先出 例1 WITH [ta] ([商品编号], [批次号], [库存数量]) AS ( UNION ALL UNION ALL UNION ALL ),[tb] ([商品编号], [订货数量 ...
- lucene之中文分词及其高亮显示(五)
中文分词:即换个分词器 Analyzer analyzer = new StandardAnalyzer();// 标准分词器 换成 SmartChineseAnalyzer analyze ...