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> 中.折叠起来的导航栏实际上是 ...
随机推荐
- 使用Spring Cloud连接不同服务
http://www.infoq.com/cn/articles/spring-cloud-service-wiring 主要结论 Spring Cloud为微服务系统中相互依赖的服务提供了丰富的连接 ...
- redis 指令文档
参考:https://redis.io/commands http://www.runoob.com/redis/redis-lists.html redis: 打开一个 cmd 窗口 使用cd命令切 ...
- poj3349 Snowflake Snow Snowflakes
吼哇! 关于开散列哈希: 哈希就是把xxx对应到一个数字的东西,可以理解成一个map<xxx, int>(是不是比喻反了) 我们要设计一个函数,这个函数要确保同一个东西能得到相同的函数值( ...
- 跟着 underscore 学节流
更多内容请参考:我的新博客 在上一篇文章中,我们了解了为什么要限制事件的频繁触发,以及如何做限制: debounce 防抖 throttle 节流 上次已经说过防抖的实现了,今天主要来说一下节流的实现 ...
- Can not issue data manipulation statements with executeQuery()错误解决
转: Can not issue data manipulation statements with executeQuery()错误解决 2012年03月27日 15:47:52 katalya 阅 ...
- request 对于cookie,session, json的处理
一.cookie是存放在客户端,session是存放在服务端. 因为http是无状态的,当客户端发送请求给服务端的时候,服务端为了区分下一次发送请求的是不是同一个客户,那么就需要用一种方式记录下这个客 ...
- Proxy代理模式
https://www.cnblogs.com/vincentzh/p/5988145.html https://www.cnblogs.com/wrbxdj/p/5267370.html(不错)
- 改xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android=" ...
- (线性dp 最大连续和)POJ 2479 Maximum sum
Maximum sum Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 44459 Accepted: 13794 Des ...
- 面向对象【day07】:知识点回顾(十一)
本节内容 1.self关键字 2.封装 3.继承 4.静态方法 一.self关键字 作用:调用当前方法的对象 1 2 3 4 5 6 7 8 9 10 11 12 13 14 class Foo: ...