-
前面看到的表单控件都正常的大小。可以通过设置控件的height，line-height，padding和font-size等属性来实现控件的高度设置。不过Bootstrap框架还提供了两个不同的类名，用来控制表单控件的高度。这两个类名是： 1、input-sm:让控件比正常大小更小 2、input-lg:让控件比正常大小更大查看全部
-
按钮也是表单重要控件之一,制作按钮通常使用下面代码来实现： ☑ input[type=“submit”] ☑ input[type=“button”] ☑ input[type=“reset”] ☑ <button> 在Bootstrap框架中的按钮都是采用<button>来实现。 有关于Bootstrap中按钮如何制作，在这里不做过多阐述，因为按钮也是Bootstrap框架中核心部分之一，后面我们专门有一节内容来介绍Bootstrap的按钮。 这里先让大家看看Bootstrap的按钮长成什么样：查看全部
-
为方便单独导入特效文件，Bootstrap V3.2中提供了12种JavaScript插件，他们分别是： ☑ 动画过渡（Transitions）:对应的插件文件“transition.js” ☑ 模态弹窗（Modal）:对应的插件文件“modal.js” ☑ 下拉菜单（Dropdown）：对应的插件文件“dropdown.js” ☑ 滚动侦测（Scrollspy）：对应的插件文件“scrollspy.js” ☑ 选项卡（Tab）：对应的插件文件“tab.js” ☑ 提示框（Tooltips）：对应的插件文件“tooltop.js” ☑ 弹出框（Popover）：对应的插件文件“popover.js” ☑ 警告框（Alert）：对应的插件文件“alert.js” ☑ 按钮（Buttons）：对应的插件文件“button.js” ☑ 折叠/手风琴（Collapse）：对应的插件文件“collapse.js” ☑ 图片轮播Carousel：对应的插件文件“carousel.js” ☑ 自动定位浮标Affix：对应的插件文件“affix.js”查看全部
-
panel-primary：重点蓝 panel-success：成功绿 panel-info:信息蓝 panel-warning：警告黄 panel-danger：危险红查看全部
-
带有头和尾的面板 panel-heading：用来设置面板头部样式 panel-footer：用来设置面板尾部样式查看全部
-
面板--基础面板 基础面板非常简单，就是一个div容器运用了“panel”样式，产生一个具有边框的文本显示块。由于“panel”不控制主题颜色，所以在“panel”的基础上增加一个控制颜色的主题“panel-default”，另外在里面添加了一个“div.panel-body”来放置面板主体内容查看全部
-
多彩列表组 list-group-item-success：成功，背景色绿色 list-group-item-info：信息，背景色蓝色 list-group-item-warning：警告，背景色为黄色 list-group-item-danger：错误，背景色为红色 如果你想给列表项添加什么背景色，只需要在“list-group-item”基础上增加对应的类名查看全部
-
列表项的状态设置 active：表示当前状态 disabled：表示禁用状态查看全部
-
Bootstrap框加在链接列表组的基础上新增了两个样式： list-group-item-heading：用来定义列表项头部样式 list-group-item-text：用来定义列表项主要内容查看全部
-
list-group-item-heading：用来定义列表项头部样式 list-group-item-text：用来定义列表项主要内容查看全部
-
将ul.list-group使用div.list-group来替换，而li.list-group-item直接用a.list-group-item来替换查看全部
-
表单在一行显示： 在Bootstrap框架中实现这样的表单效果是轻而易举的，你只需要在<form>元素中添加类名“form-inline”即可。 内联表单实现原理非常简单，欲将表单控件在一行显示，就需要将表单控件设置成内联块元素（display:inline-block）。 /*源码请查阅bootstrap.css文件第1928行~第1962行*/ 如果你要在input前面添加一个label标签时，会导致input换行显示。如果你必须添加这样的一个label标签，并且不想让input换行，你需要将label标签也放在容器“form-group”中，如：查看全部
-
在Bootstrap框架中要实现水平表单效果，必须满足以下两个条件： 1、在<form>元素是使用类名“form-horizontal”。 2、配合Bootstrap框架的网格系统。（网格布局会在以后的章节中详细讲解） 在<form>元素上使用类名“form-horizontal”主要有以下几个作用： 1、设置表单控件padding和margin值。 2、改变“form-group”的表现形式，类似于网格系统的“row”。查看全部
-
随着各种手持设备的出现，要想让你的Web页面适合千罗万像的设备浏览，响应式设计的呼声越来越高。在Bootstrap中也为表格提供了响应式的效果，将其称为响应式表格。 Bootstrap提供了一个容器，并且此容器设置类名“.table-responsive”,此容器就具有响应式效果，然后将<table class="table">置于这个容器当中，这样表格也就具有响应式效果。 Bootstrap中响应式表格效果表现为：当你的浏览器可视区域小于768px时，表格底部会出现水平滚动条。当你的浏览器可视区域大于768px时，表格底部水平滚动条就会消失。示例如下：查看全部
-
何谓紧凑型表格，简单理解，就是单元格没内距或者内距较其他表格的内距更小。换句话说，要实现紧凑型表格只需要重置表格单元格的内距padding的值。那么在Bootstrap中，通过类名“table-condensed”重置了单元格内距值。 紧凑型表格的运用，也只是需要在<table class="table">基础上添加类名“table-condensed”：查看全部
举报
0/150
提交
取消