你的位置:首页 > 网页设计

[网页设计][Bootstrap]全局样式(三)


表格

1、基本类  .table  {width/margin-bottom/}  {padding/border-top}

2、条纹表格  .table-striped  {nth-of-type(odd):background-color}

3、边框表格  .table-border  {border}

4、鼠标悬停  .table-hover  {background-color}

5、紧缩的表格  .table-condesed

6、状态类  .active  .success  .warning  .danger  .info

7、响应式表格  .table-responsive

 

表单

1、使用label和控件组合使用,包裹在.from-group里面获得最好的排列  {margin-bottom}

2、<input>、<select>、<textarea>加类.form-control  {width/padding/border-radius/border}

3、内联表单  .form-inline

4、水平排列  .form-horizontal+栅格类+.control-label

5、输入框  input:text  几乎浏览器自带样式

6、文本域  input:textarea  几乎浏览器自带样式

7、单选和多选 div+.radio/.radio-inline/.checkkbox/.checkbox-inline+属性disabled/.disabled

8、内联单选和多选  .radio-inline/.checkbox-inline

9、下拉列表  几乎浏览器自带样式

10、静态控件  .form-control-staitic+p

11、禁用状态  disable属性  {cursor/background-color}

12、<filedset>   disable属性  禁用包含的所有控件

13、只读状态  readonly属性  {background-color}

14、校验状态  .has-success  .has-warning  .has-error

15、校验状态+图标  .has-feedback+feedback icon

16、 水平排列/内联+校验+图标  .form-horizontal/.form-inline+校验类+.has-feedback+feedback icon

17、控件尺寸  .input-lg  {height/padding/border-radius/font-size}

18、水平排列控件尺寸  .form-group-lg/.form-group-sm

19、列尺寸  栅格类.row+.col-**-*控制尺寸