bootstrap学习笔记(一)

适应不同屏幕宽度

<meta name=“viewport” content=“width=device-width,initial-scale=1”>

.container 固定宽度  响应式布局

.container-fluid  自由宽度(100%)  响应式布局

<del>删除线

文本对齐

.text-left 

.text-center 

.text-right 

.text-justify两端对齐

列表样式

.list-unstyled无符号 

.list-inline行内块

表格样式

.table全局样式  少量padding和水平分割线  响应式布局

.table-striped隔行变色  class=“table table-striped”

.table-bordered带边框的表格

.table-hover鼠标放上变色 离开回复

.table-condensed紧凑

行或单元格背景色 只能给<tr>或<td>添加

.active

.success

.info

.warning

.danger

响应式表格

将.table元素包裹在.table-responsive元素创建响应式表格  文字不换行 出现滚动条(width<768px)

表格不能包含div div能包含表格

表单样式

.form-group包含<label>和表单元素

.form-control用于<input><textarea><select>

.form-inline用于form元素 元素一行排列

.radio-inline一行排列

.checkbox-inline一行排列

.sr-only隐藏元素