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> 中.折叠起来的导航栏实际上是 ...
随机推荐
- java 数组声明定义 数组内存分配 数组初始化 数组引用 数组的遍历
一,数组的定义 Java 中定义数组的语法有两种: 1. type arrayName[]; 2. type[] arrayName;type 为Java中的任意数据类型,包括基本类型和组合类型,ar ...
- Ubuntu下搜狗输入法无法输入中文
现象:无法打出中文,但是有输入框.如下图所示情形: 解决方法 删除配置文件,重启fcitx 配置文件在~/.config下的3个文件夹里SogouPY.SogouPY.users.sogou-qimp ...
- openvpn部署账号密码登录
1.开启服务器端路由转发功能: 修改配置文件/etc/sysctl.conf中 net.ipv4.ip_forward = 0 改为 net.ipv4.ip_forward = 1 [root@nod ...
- gradle的安装配置成功标志
gradle主要位于AndroidStudio中 看我的目录 在环境变量里添加用户变量 GRADLE_HOME 然后在环境变量 path 中增加 %GRADLE_HOME%\bin;,如图所示 测试配 ...
- 一个时间上的比较 if else
if (w<b.w) ; if (w>b.w) ; if (w<b.w) ; else if (w>b.w) ; 对于任何情况,执行的次数都是一样.只是对于汇编的代码,第二个方 ...
- RabbitMQ入门-队列
先建工程 下一步,输入坐标 下一步,输入工程名 先看一下最终目录 修改pom文件 <?xml version="1.0" encoding="UTF-8" ...
- STM32F103 ------ 时钟配置
由于stm32的库默认是外部晶振8M的情况下实现的,所以配置波特率的时候也是按8M,包括主频,如果用12M晶振就需要改动几个地方: 在system_stm32f10x.c中找到相应类型的文件,进行如下 ...
- qml:基本知识记录
1. property信号处理函数: 在qml中,通过property可以定义属性,这些属性自带信号处理函数,例如: property string szTitle: “hello wor ...
- cucumbe无法识别中文场景的问题
import org.junit.runner.RunWith; import cucumber.api.CucumberOptions; import cucumber.api.junit.Cucu ...
- docker 基础之数据管理
数据卷 一.将本地默认目录挂载到docker容器内指定的目录 #将本地的目录挂在到docker容器内 docker run -it --name container-test -h CONTAINER ...