grid 柵格布局
grid(網格) 模組為 display 屬性提供了乙個新的值：grid。當你將任何元素的 display 屬性設定為 grid 時，那麼這個元素就是乙個 網格容器(grid container)，它的所有直接子元素就成了 網格項(grid items)。
它將網頁劃分成乙個個網格，可以任意組合不同的網格，做出各種各樣的布局。以前，只能通過複雜的 css 框架達到的效果，現在瀏覽器內建了。
語法：
display:grid;寫在容器上面grid-template-rows 屬性 定義每一行的行高
可以使用絕對單位，也可以使用百分比，還可以使用repeat()函式。
repeat()接受兩個引數，第乙個引數是重複的次數，第二個引數是所要重複的值。
例子：
grid-template-columns:
repeat(3
,33.33%)
;
rid-column-start屬性：左邊框所在的垂直網格線
grid-column-end屬性：右邊框所在的垂直網格線
grid-row-start屬性：上邊框所在的水平網格線
grid-row-end屬性：下邊框所在的水平網格線
還有很多屬性，我就不一一介紹了，又這些屬性就可以寫乙個bootstrap的柵格系統。
如下:
效果：
就這樣乙個簡單的柵格系統就寫好了
CSS筆記（Bootstrap概覽）
移動裝置優先是 bootstrap 3 的最顯著的變化，為了bootstrap可以在移動端確保適當的繪製和觸屏縮放，要在頭部新增viewport meta標籤。bootstrap 包含了乙個響應式的 移動裝置優先的 不固定的網格系統，可以隨著裝置或視口大小的增加而適當地擴充套件到12 列。建立網路系...
用css寫的那些特色邊框
本文參考 css揭秘 第二章。一 半透明邊框 說起透明，肯定第乙個想到的是css3的hsla，寫個demo 小tips hsl色彩模式是工業界的一種顏色標準，是通過對色調 h 飽和度 s 亮度 l 三個顏色通道的變化以及它們相互之間的疊加來得到各式各樣的顏色的，hsl即是代表色調，飽和度，亮度三個通...
CSS之Bootstrap（快速布局）
使用 bootstrap 並不代表不用寫 css 樣式，而是不用寫絕大多數大家都會用到的樣式 en en x ua compatible content ie edge viewport content width device width,initial scale 1 media 判斷條件 針對...