可以幫助我們在ps中快速布局
12欄，16欄，24欄
我們也可以利用css樣式表模板快速寫網頁
兩欄布局網頁部分**
id="*******">
class="container_12">
class="grid_12">
工具欄div>
div>
div>
class="container_12">
id="header">
class="grid_2">
div>
div>
id="mainbody"
class="grid_8">
class="grid_2 alpha">主體1div>
class="grid_2">主體2div>
class="grid_2">主體3div>
class="grid_2 omega">主體4div>
div>
id="sidebar"
class="grid_4">
div>
class="clear">
div>
id="footer">
class="grid_8">
頁尾1div>
class="grid_2">
頁尾2div>
class="grid_2">
頁尾3div>
三欄布局網頁部分**
data-brackets-id='1256'
id="*******">
data-brackets-id='1257'
class="container_12">
data-brackets-id='1258'
class="grid_12">
工具欄div>
div>
div>
data-brackets-id='1259'
class="container_12">
data-brackets-id='1260'
id="header">
data-brackets-id='1261'
class="grid_2">
data-brackets-id='1262'>頁頭h2>
div>
div>
data-brackets-id='1263'
id="mainbody"
class="grid_6 push_2">
data-brackets-id='1264'>mainbody 主體h2>
data-brackets-id='1265'
class="grid_3 alpha">主體1div>
data-brackets-id='1266'
class="grid_3 omega">主體4div>
div>
data-brackets-id='1267'
id="left-sidebar"
class="grid_2 pull_6">
data-brackets-id='1268'> 左邊欄h2>
div>
data-brackets-id='1269'
id="sidebar"
class="grid_4">
data-brackets-id='1270'>sidebar 邊欄h2>
div>
data-brackets-id='1271'
class="clear">
div>
data-brackets-id='1272'
id="footer">
data-brackets-id='1273'>頁尾h2>
data-brackets-id='1274'
class="grid_8">
頁尾1div>
data-brackets-id='1275'
class="grid_2">
頁尾2div>
data-brackets-id='1276'
class="grid_2">
頁尾3div>
1 網格系統
第乙個例子 建立一行 然後，新增是需要的列 col 類中設定 第乙個星號 表示響應的裝置 sm,md,lg 或 xl,第二個星號 表示乙個數字,同一行的數字相加為 12。第二個例子 不在每個col上新增數字，讓 bootstrap 自動處理布局，同一行的每個列寬度相等 兩個 col 每個就為 50 ...
960 Grid System 網格系統
2 按照順序引用三個css檔案。在html檔案中嵌入 css為檔案所在目錄 rel stylesheet type text css media all href css reset.css rel stylesheet type text css media all href css text.c...
Bootstrap4 網格系統
col 第乙個 是裝置型別，第二個 是控制項寬度的佔比 螢幕被等分為12，col 1寬度是1 12，col 6寬度是50 col 12寬度是100 給應用了class的element，新增上style background color red 通過背景色可以比較方便地看出效果。bootstrap 4...