# Foundation 塊狀網格
塊狀網格用于均分頁面內容:例如一行內要顯示四張圖片,不管什么屏幕下都需要均分寬度。
可以使用 `<ul>` 元素加上 `.small|medium|large-block-grid-_num_` 類來創建塊狀網格。_num_ 用于指定均分是數量:
### 實例
```
<ul class="small-block-grid-3">
? <li><img src="newyork.jpg" alt="New York"></li>
? <li><img src="paris.jpg" alt="Paris"></li>
? <li><img src="sanfran.jpg" alt="San Francisco"></li>
</ul>
```
另一個實例,使用段落:
### 實例
```
<ul class="small-block-grid-3">
? <li><p>Just a Simple Example Text...</p></li>
? <li><p>Just a Simple Example Text...</p></li>
? <li><p>Just a Simple Example Text...</p></li>
</ul>
```
## 不同尺寸屏幕顯示不同數量
通過添加多個網格塊類可以設置不同尺寸屏幕顯示不同的塊數量:
### 實例
```
<ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4">
? <li><img src="newyork.jpg" alt="New York"></li>
? <li><img src="paris.jpg" alt="Paris"></li>
? <li><img src="sanfran.jpg" alt="San Francisco"></li>
? <li><img src="newyork.jpg" alt="New York"></li>
</ul>
```
- Foundation 入門
- Foundation 5 簡介
- Foundation 起步
- Foundation 文本
- Foundation 表格
- Foundation 按鈕
- Foundation 按鈕組
- Foundation 圖標
- Foundation 標簽
- Foundation 提醒框
- Foundation 進度條
- Foundation 面板
- Foundation 圖片
- Foundation 下拉菜單
- Foundation 折疊列表
- Foundation 列表
- Foundation 選項卡
- Foundation 分頁
- Foundation 價格表
- Foundation 頂部導航欄
- Foundation 側邊欄
- Foundation 滑動導航(Off-Canvas)
- Foundation 麥哲倫(Magellan)導航
- Foundation 表單
- Foundation 輸入框尺寸
- Foundation 開關
- Foundation 滑塊
- Foundation 提示框
- Foundation 模態框
- Foundation Joyride
- Foundation 均衡器(Equalizer)
- Foundation 網格
- Foundation 網格系統
- Foundation 網格 - 水平堆疊
- Foundation 網格 - 小型設備
- Foundation 網格 - 中型設備
- Foundation 網格 - 大型設備
- Foundation 塊狀網格
- Foundation 網格實例
- Foundation 參考手冊
- Foundation 圖標參考手冊
- Foundation CSS 參考手冊
- Foundation CSS 可見性