Bootstrap历练实例：导航内的下拉菜单
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：导航内的下拉菜单</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:20px">
<nav class="navbar navbar-default"role="navigation">
<div class="navbar-header">
<a href="#" class="navbar-brand">
w3cschool
</a>
</div>
<div>
<ul class="nav navbar-nav">
<li><a href="#">Html5</a></li>
<li><a href="#">Css3</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">jQueryUI</a></li>
<li><a href="#">AngularJS</a></li>
<li><a href="#">C#.Net</a></li>
<li><a href="#">MsSql</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle"data-toggle="dropdown">Html5前端<span class="caret"></span></a>
<ul class="dropdown-menu"role="menu">
<li><a href="#">Html5</a></li>
<li><a href="#">Css3</a></li>
<li><a href="#">Bootstrap</a></li>
<li><a href="#">Javascript</a></li>
<li><a href="#">jQuery</a></li>
<li><a href="#">jQueryUI</a></li>
<li><a href="#">AngularJS</a></li>
<li class="divider"></li>
<li><a href="#">C#.Net</a></li>
<li><a href="#">MsSql</a></li>
</ul>
</li>
</ul>
</div>
</nav>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>
Bootstrap历练实例：导航内的下拉菜单的更多相关文章
- Bootstrap历练实例：标签页内的下拉菜单
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- CSS 笔记——导航栏、下拉菜单、提示工具
8. 导航栏.下拉菜单.提示工具 (1)导航栏 垂直导航栏 <!DOCTYPE html> <html lang="en"> <head> &l ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮：内嵌下拉菜单的按钮组
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Bootstrap系列 -- 36. 向上弹起的下拉菜单
有些菜单是需要向上弹出的,比如说你的菜单在页面最底部,而这个菜单正好有一个下拉菜单,为了让用户有更好的体验,不得不让下拉菜单向上弹出.在Bootstrap框架中专门为这种效果提代了一个类名“dropu ...
- BootStrap字体图标不显示、下拉菜单不显示
在W3CSchool学习BootStrap教程时遇到的问题…… 1.字体图标不能显示 上面是正常显示的样子,不能正常显示,因为缺少下面的字体图标样式文件 (1)在下载的Bootstrap包中将font ...
- HTML+CSS实现导航栏二级下拉菜单完整代码
工具是vs code 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- Bootstrap页面布局15 - BS带下拉菜单的按钮
带下拉菜单的按钮 <div class='btn-toolbar'> <div class='btn-group'> <a href='javascript:;' cla ...
- Bootstrap页面布局16 - BS导航菜单和其响应式布局以及导航中的下拉菜单
代码: <div class='container-fluid'> <h2 class='page-header'>导航</h2> <!-- .navrbar ...
- js实现网站导航的二级下拉菜单
http://www.codesky.net/article/201109/1200js/%E5%AE%9E%E7%94%A8%E5%AF%BC%E8%88%AA%E8%8F%9C%E5%8D%95. ...
随机推荐
- java基础第七篇之接口
1.什么是接口: * 接口是方法的集合,而且接口中的方法全是抽象的 * 你可以把接口看成一个特殊的"抽象类",接口中的方法全是抽象的 * * * 2.java中怎么定义接口: * ...
- js new Date("2016-07-01 08:00:00") 格式在IE内核浏览器中显示NaN的问题
js new Date("2016-07-01 08:00:00") 格式在IE内核浏览器中显示NaN的问题 废话就不多了,var dd = new Date("2016 ...
- 从各处收集的switch语句
重构之重复代码: 1.(重复代码是)语义一致的逻辑 反例:语义一致的逻辑产生了多个实体 缺点:如果你为语义一致的逻辑产生了多个实体,那么当需要修改这个逻辑时,你必须保证同时修改所有的实体,并确保它们是 ...
- mac 安装cocoapods
按主command+空格 输入ter 就能看到终端 左键单机(直接点回车键也可以)打开即可 需要先安装ruby环境 安装rvm curl -sSL https://get.rvm.io | bash ...
- php：获取一个表不含text类型的全部字段
select * from table 这个*用表具体的字段替换 $sql="show COLUMNS FROM table"; $rs=query($sql); while($r ...
- mysql ibd 文件过大问题
公司的数据库挂了查了下 ,每个表都有自己独立的表空间,有一张表的ibd 文件有好几G了.然后想要释放它. 解决方案: 第一种,删除表,然后重新建.drop table 操作自动回收表空间 第二种,al ...
- python 1 学习廖雪峰博客
输出 用print()在括号中加上字符串,就可以向屏幕上输出指定的文字.比如输出'hello, world',用代码实现如下: >>> print('hello, world') p ...
- 过流监测芯片ADS720/723
在电机应用领域经常需要用到过流监测和保护,allegro的ADS系列就可以很好实现.将芯片串接在电机之前,根据自己要保护的电流大小选择合适的量程,个根据自己ADC测量电压范围选择合适的灵敏度.这类芯片 ...
- 前端html与css学习笔记总结篇(超详细)
第一部分 HTML 第一章 职业规划和前景 职业方向规划定位: web前端开发工程师 web网站架构师 自己创业 转岗管理或其他 web前端开发的前景展望: 未来IT行业企业需求最多的人才 结合最新的 ...
- [转]Todd.log - a place to keep my thoughts on programming 分布式架构中的幂等性
Todd.log - a place to keep my thoughts on programming 理解HTTP幂等性 基于HTTP协议的Web API是时下最为流行的一种分布式服务提供方式. ...