1.窗口和設備的窗口保持一致,初始縮放100%,禁止用戶縮放css
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no">html
2.css 佈局api
<div class="container">內容</div> 固定寬段1170px佈局
<div class="container-fluid">內容</div> 固定寬段100%ui
3.排版spa
h1 36pxscala
h2 30pxcode
h3 24pxorm
h4 18pxhtm
h5 14px
h6 12px
.page-header 設置頁面的頭部 給標題加一個分割線
<small></small> 副標題 小一號
<big></big> 副標題 大一號
<strong></strong> 建議使用
<em></em> 建議使用
<del></del> 刪除線
4.文本對齊方式
.text-left 左對齊
.text-center 居中
.text-right 右對齊
.text-uppercase 英文所有大寫
.text-lowercase 所有英文小寫
.text-capitalize 首字母大寫
5.列表
.list-unstyled ul 去遠點 去掉原有的格式
.list-inline 變成行內樣式
自定義列表 橫向排列
<dl class="dl-horizontal">
<dt> 標題</dt>
<dd>標題解釋</dd>
</dl>
6.表格
.table 是一個基類 若是要加樣式必需要有
.table-bordered 表格的外邊框
.table-hover 鼠標懸停效果
.table-striped 各行換色
.table-condensed 變緊湊 主要是padding值減半
.table-responsive 給table的父元素加 變成響應性的表格 以移動設備爲優先
7.響應式圖片
.img-responsive 響應式
.img-circle 橢圓形
.img-rounded 圓角矩形
.img- thumbnail 圓角邊框
8.柵格系統
柵格系統必定要放在容器中 .container .container-fluid
9.偏移
.col-md-offset-* 只能向右偏移
10.排序
.col-md-push-*
向左排序
.col-md-pull-* 向右排序
11.表單
.form-group 一組
.form-control 圓角輸入框 給輸入框加
.checkbox-inline
或 .radio-inline
類應用到一系列的多選框(checkbox)或單選框(radio)控件上,是給label 加
.disabled 禁止
.input-group-addon 搜索框的樣式
.form-horizontal 給表單加 變成響應式效果 必須結合柵格系統