HTML5技术

[Bootstrap]组件(三) - 盛夏、光年

字号+ 作者:H5之家 来源:博客园 2016-05-16 15:00 我要评论( )

输入框组 添加额外元素.input-group-addon 外包元素.input-groupinput-group-addon+form-control 额外元素 输入框组尺寸 控制类.input-group-*: .input-group-lg/.input-group-sm 额外元素 额外元素添加单选或多选 在额外元素中嵌套单选或多选按钮元素 额外

输入框组

添加额外元素.input-group-addon

外包元素.input-group>input-group-addon+form-control

额外元素

 

输入框组尺寸

控制类.input-group-*: .input-group-lg/.input-group-sm

额外元素

 

额外元素添加单选或多选

在额外元素中嵌套单选或多选按钮元素

 

额外元素为按钮

额外按钮类.input-group-btn

额外元素按钮

 

额外元素为下拉按钮菜单

.input-group-btn包含下拉按钮菜单元素(包括触发器和下拉菜单)

button item1item2

 

额外元素为分裂式按钮下拉菜单

额外元素包含分裂式按钮下拉菜单(按钮,触发器和下拉菜单)

buttonitem1item2

 

导航

基类.nav  {padding-left/margin-bottom/list-style}

 

标签页导航

标签页类.nav-tabs  活动选项类.active 选项添加role="presentation"

HomeProfileMessages

 

胶囊式标签导航.nav-pills

HomeProfileMessages

胶囊式标签导航(堆叠状).nav-stacked

HomeProfileMessages

 

禁用的链接

 对选项添加类.disabled

HomeProfileMessages

 

带下拉菜单的标签页面

在某一个选项中添加下拉菜单组件

HomeProfile Messages item1item2

 

下拉导航页面

外包元素>{[导航ul(基类.nav+样式类.*s)>选项li(基本选项role="persentation"+下拉选项)]+[选项对应内容]}

item1item2item3 item4 item4-1item4-2item4-3item1-contentitem2-contentitem3-contentitem4-1-contentitem4-2-contentitem4-3-content

 

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Omi树组件omi-tree编写指南 - 【当耐特】

    Omi树组件omi-tree编写指南 - 【当耐特】

    2017-05-02 15:04

  • 对于Bootstrap的介绍以及如何使用 - novai-L

    对于Bootstrap的介绍以及如何使用 - novai-L

    2017-04-29 09:00

  • 在Delphi下使用迅雷APlayer组件进行免注册开发 - Delphi力量

    在Delphi下使用迅雷APlayer组件进行免注册开发 - Delphi力量

    2017-04-28 15:00

  • JS组件系列——自己动手封装bootstrap-treegrid组件 - 懒得安分

    JS组件系列——自己动手封装bootstrap-treegrid组件 - 懒得安分

    2017-04-28 14:02

网友点评