bootstrap 柵格系統

2021-10-01 20:12:00 字數 480 閱讀 1996

cdn:網路**託管

優點:減少伺服器請求

柵格系統的容器:

固定寬居中:container

0-768移動端 768-992pad端 992-1200pc端 1200-pc端寬屏

xs sm md lg

100% 750 970 1170

全屏(百分百):container-fluid

注意:子元素若要實現全屏寬度,則需要加上

margin-left:-15px;margin-right:-15px;

row:行

col:列

輔助工具:隱藏hidden-* 顯示visible-*

列偏移:col-sm-offset-1

注意:列偏移同樣作用在當前範圍以及更寬的範圍

如果需要只作用在當前範圍,則需要宣告更寬的範圍偏移為0

列排序:

向左:col--pull-

向右:col--push-

Bootstrap 柵格系統

目錄 1 簡介 2 柵格選項 3 列偏移 4 巢狀列 5 列排序 1 簡介 bootstrap內建了一套響應式 移動裝置優先的流式柵格系統,隨著螢幕裝置或視口 viewport 尺寸的增加,系統會自動分為最多12列。它包含了易於使用的預定義classe,還有強大的mixin用於生成更具語義的布局。2...

Bootstrap柵格系統

bootstrap基本模板 bootstrap 提供了一套響應式 移動裝置優先的流式柵格系統,隨著螢幕或視口 viewport 尺寸的增加,系統會自動分為最多12列。它包含了易於使用的預定義類,還有強大的mixin 用於生成更具語義的布局。頁面中的一行,比例可以自己定義,但必須保證是12列,如果缺少...

bootstrap柵格系統

containers 容器 容器是最基本的布局元素在bootstrap中,特別對於網格布局。流動容器,意味它的容器寬度是會改變的。100 wide寬度。響應斷點 由於bootstrap首先被開發為可移動的,所以我們使用一些 查詢來為布局和介面建立合理的斷點。這些斷點大多基於最小視口寬度,允許我們在視...