bootstrap 导航布局
2015-06-06 13:44
661 查看
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <title>Bootstrap</title> <meta name="description" content=""> <meta name="keywords" content=""> <!-- 设置自适应设备 width=device-width宽度为设备宽度 initial-scale=1缩放比例设置为当前不缩放 --> <meta name="viewport" content="width=device-width , initial-scale=1, user-scalable=no"> <script src="./bootstrap/js/bootstrap.min.js" ></script> <script src="./bootstrap/js/jquery.js"></script> <link rel="stylesheet" href="./bootstrap/css/bootstrap.css"> </head> <body> <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <div class="container"> <div class="navbar-header"> <a href="#" class="navbar-brand">天涯alone</a> </div> <div id="navbar" class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li class="active"><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Cantent</a></li> </ul> </div> </div> </nav> </body> </html>
效果如下:
相关文章推荐
- BootStrap 智能表单系列 六 表单数据绑定(编辑页面的数据绑定)
- BootStrap 智能表单系列 八 表单配置json详解
- BootStrap 智能表单系列 七 验证的支持
- BootStrap 智能表单系列 五 表单依赖插件处理
- BootStrap 智能表单系列 四 表单布局介绍
- BootStrap 智能表单系列 三 分块表单配置的介绍
- BootStrap 智能表单系列 二 BootStrap支持的类型简介
- bootstrap 智能表单 demo示例
- bootstrap 学习笔记 - 5 (Glyphicons字体 + 下拉菜单 + 按钮组+ 按钮下拉菜单)
- 基于Bootstrap3制作响应式布局网站(四)
- ASP.NET MVC Bootstrap极速开发框架
- 解决jquery-ui-autocomplete选择列表被Bootstrap模态窗遮挡的问题
- Bootstrap 栅格系统的精妙之处
- BootStrap实现带有增删改查功能的表格(DEMO详解)
- BootStrap 智能表单系列 首页 (持续更新中...)
- 基于 bootstrap 的数据展示--bootgrid 样式修改。
- Bootstrap--全局css样式之表单
- bootstrap 学习笔记 - 4 (按钮 + 图片 + 辅助类)
- Bootstrap 斜体、文本对齐、缩略图、地址、列表等
- bootstrap-table给每行添加编号