BootStrap框架--全局CSS样式

Button：
  .btn{padding:; border:;}
  .btn-default{color:; background-color:; border-color:;}
  -----------------------------------------------------------
  .btn-danger :红
  .btn-success:绿
  .btn-warning:黄
  .btn-info : 浅蓝
  .btn-primary:深蓝
----------------------------------------------------
 .btn-lg:大
 .btn-md:中（默认，无需设置）
 .btn-sm:小
 .btn-xs:最小
-------------------------------------------------------
 .btn-block:块级按钮
----------------------------------
 .pull-left(float:left):左浮（拉）
 .pull-right(float:right):右浮(拉)


Img：


 .img-rounded 圆角(border-radius:6px)
 .img-circle  圆形（border-radius:50%）
 .img-thumbnail 缩放图片/拇指图片
 .img-responsive 响应式图片


-----------------------------------------------


排版和代码（和文本）（了解）
 .text-danger 红色 文本
 .bg-info 浅蓝 背景
 ....(与按钮设置的颜色一致)


--------------------------------------------


 .text-left
 .text-right
 .text-center
 .text-justify 文本两端对齐


.text-uppercase  大写
.text-capitalize  首字母大写
.text-lowercase 小写
---------------------------------------------------


Table：
 .table
 .table-bordered --边框
 .table-responsive - (PS:运用于外的DIV（父级）上，达到响应式) overflow-y:haddien overflow-x:auto
 .table-striped - -隔行变色（tr：nth-of-type(odd)）--奇数
 .table-hover - 鼠标悬停


栅格系统：


Web开发页面布局的方式：
 （1）使用TABLE做布局
           优势：简单不易出错  不足：加载效率低
 （2）使用DIV+CSS
           优势：加载速度快，灵活  不足：不易控制
 （3）使用BootStrap提供的栅格（Grid Layout）布局
           优势：加载速度快、灵活、支持响应式功能、易控制（有行和列的概念，但使用DIV+CSS实现）
 ** 栅格布局系统特点：
   （1）所有的行（row）必须放在容器中（container/container-fluid）
   （2）分为多行（row），一行中平均分为12列（col）
   （3）网页内容只能放在列中，不能放在行中
   （4）可在column中嵌套row
   （5）col分为四类：col-xs col-sm  col-md  col-xs
  ****面试：bootstrap中布局系统中容器（container）的特点
              宽度做了媒体查询
              添加了前置和后置内容生成，可以防止子元素的越界和浮动造成的影响


***表单---
   

     

         
         
             
     

 
   

 行内:

            
         

 **水平：
   .form-horizontal(contariner)
  .form-group(row)
 

    使用栅格化系统控制label（class="col-md-2 control-label"）(文字右对齐)

/input(.form-control)/ .help-black(提示文字)

/ .checkbox(多选按钮)...