bootstrap 学习1

一.网格布局

1.bootstrap基本网格结构

2.位偏移（col-md-offset-3）

3.嵌套列（为了在内容中嵌套默认的网格，请添加一个新的 .row，并在一个已有的 .col-md-* 列内添加一组 .col-md-* 列。被嵌套的行应包含一组列，这组列个数不能超过12（其实，没有要求你必须占满12列））

4.列排序（col-md-push-*  col-ma-pull-*）

  

二、bootstrap排版

三、表格

表格类

  

四、表单（分为3类：默认表单、内敛表单、水平表单）

默认表单：

基本的表单结构是 Bootstrap 自带的，个别的表单控件自动接收一些全局样式。下面列出了创建基本表单的步骤：

  向父 <form> 元素添加 role="form"。

  把标签和控件放在一个带有 class .form-group 的 <div> 中。这是获取最佳间距所必需的。

  向所有的文本元素 <input>、<textarea> 和 <select> 添加 class ="form-control" 。

  

 

 内联表单：

如果需要创建一个表单，它的所有元素是内联的，向左对齐的，标签是并排的，请向 <form> 标签添加 class .form-inline。

使用 class .sr-only，您可以隐藏内联表单的标签。

 

水平表单:

 向父 <form> 元素添加 class .form-horizontal。

 把标签和控件放在一个带有 class .form-group 的 <div> 中。

 向标签添加 class .control-label。

 

表单的状态（focus）、表单的大小都可控制（ .input-lg 和 .col-lg-* 来设置表单的高度和宽度）、禁止输入添加(disabe属性)

五、按钮

激活：

         

禁用：