css框架
阿新 • • 發佈：2017-05-10
ext html5 idt contain 尺寸 css head 數據標簽 con
CSS框架
960Grid
即960布局，現基本不再使用
Bootstrap
需將頁面設置為HTML5文檔類型
1. 引入外部CSS文件
使用<link>引入，一般只引入核心文件，主題文件不引入
2. 移動設備優先
在<head>標簽中添加viewport元數據標簽
<meta name="viewport" content="width=device-width,inital-scale=1">
width:可視區的寬度，值為device-width
intial-scale:頁面首次被顯示時可視區域的縮放級別，取值為1.0則頁面按實際尺寸顯示，無任何縮放
3. 布局容器
Bootstrap需為頁面內容和柵格系統包裹一個.container容器：
.container類用於固定寬度並支持響應式布局的容器
.container-fluid類用於100%寬度
柵格系統
通過行(row)和列(column)的組合創建頁面布局
1. 工作原理
1..row必須包含在.container或.container-fluid中
2.通過.row在水平方向上創建一組列.col
3.內容應該在.col中，且只有.col可作為.row的直接子元素
4..col的範圍為1~12
2. 柵格參數
.col-xs-(xs是extra small的縮寫) <768px .col-sm-(sm是small的縮寫) >=768px .col-md-(xs是middle的縮寫) >=992px .col-lg-(xs是large的縮寫) >=1200px
xs總是水平排列，sm、md、lg開始始堆疊在一起，超過這些值後水平排列
css框架