bootstrap 基础知识学习(导航+其他)

原创 2015年07月09日 16:16:42


十一.导航


   =》 基础

    语法:.nav.nav-tabs.nav-pills配合使用

 

 

=》垂直导航

 

 

=》二级导航 

 


=》面包屑式导航(常用于显示当前位置)

 

 


=》导航条(导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多。

语法:.navbar-nav,导航条的默认颜色.navbar-default(米黄)”:


 

.navbar-header导航标题 .navbar-brand 导航标题的默认样式



  .navbar-fixed-top:导航条固定在浏览器窗口顶部

  .navbar-fixed-bottom:导航条固定在浏览器窗口底部

 

 

 

=》响应式导航 .collapse  .navbar-collapse 


 

 

 

=》分页导航

 

 


十二 其他


=》标签

有时某些导航或新闻想要加上某些标签来强调内容的新或重要

label-deafult:默认标签,深灰色

 label-primary:主要标签,深蓝色

 label-success:成功标签,绿色

 label-info:信息标签,浅蓝色

 label-warning:警告标签,橙色

 label-danger:错误标签,红色

 


 

=徽章

 

 

 

 

 

 

=缩略图

 

.thumbnail


 

 

没有.thumbnail

 

  添加介绍信息等




 

=》警示框

 

默认

 

 

 

带关闭按钮



 

带链接

 

 

 

=》进度条

 

 

基本

 

 


 

=》媒体对象(很好的替代了dl/dt/dd的传统写法)

 

 

 

=》面板 panel

 

基础

 

 

Panel-default:默认

panel-primary:重点蓝

 panel-success:成功绿

 panel-info:信息蓝

 panel-warning:警告黄

 panel-danger:危险红


 

版权声明:本文为博主原创文章,未经博主允许不得转载。

一张思维导图,告诉你Android新手如何快速入门

本文来自AndroidDeveloper的公众号,您可以搜索公众号:googdev,来获取AndroidDeveloper的技术干货。———-/////////////////////////————...
  • vanpersie_9987
  • vanpersie_9987
  • 2016年09月13日 00:18
  • 1794

SQL SERVER 基础篇(一):知识点、SQL语句学习及详细总结

SQL SERVER 基础篇,详细总结学习sql语句和知识点,适合入门
  • ITermeng
  • ITermeng
  • 2016年12月09日 07:48
  • 2824

【Unity3D】基础知识学习笔记

Unity3D基础知识学习笔记 1、基础知识: 标题栏 菜单栏 工具栏:变换工具、gizmos切换、播放控件、层列表、布局列表 功能窗口 2、资源及资源类型:在project里面能够create的资...
  • woaini454186694
  • woaini454186694
  • 2016年05月25日 22:53
  • 4588

bootstrap基础知识学习(下拉菜单+按钮)

九、下拉菜单(3004行~第3130行) 基本结构     dropdown-header">第一部分菜单头部   //相当于下划线      Bootstrap框架中下拉菜单默认是左对齐,如果你...
  • wangjiaohome
  • wangjiaohome
  • 2015年07月09日 17:39
  • 522

bootstrap基础知识

  • 2015年03月30日 11:19
  • 1.49MB
  • 下载

导航基础知识培训

  • 2012年06月12日 09:21
  • 259KB
  • 下载

组合导航基础知识

  • 2011年11月24日 17:24
  • 4.83MB
  • 下载

导航基础知识

  • 2012年06月11日 22:43
  • 170KB
  • 下载

bootstrap 基础知识(表单)

六:表单 1、input输入框(type=text/password/email) 2、input选择框(type=“checkbox/radio”) 在Bootstrap框架中...
  • wangjiaohome
  • wangjiaohome
  • 2015年07月13日 13:46
  • 2114

1.Bootstrap基础知识

BootStrap的中文官方网站为http://www.bootcss.com/ 更详细的教程,还是访问中文官方网站 BootStrap是什么? Bootstrap,来自 Twitter,是目前...
  • gxy1317
  • gxy1317
  • 2016年08月15日 23:08
  • 117
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:bootstrap 基础知识学习(导航+其他)
举报原因:
原因补充:

(最多只允许输入30个字)