CSS 布局手册
CSS 布局手册旨在汇集常见的布局样式，这些布局你可能在自己的网站中会用到。这些布局样式不仅仅可以用来开始一个项目，而且提供了具体的使用方法，作为开发人员，你可以做出合适的选择。
备注： 如果你是首次接触 CSS 布局，你可以先看一下 CSS 布局学习模块，其中的基础知识有利于你更好的使用本书中的布局样式。
布局专题
| 专题 | 描述 | 布局方法 |
|---|---|---|
| 媒体对象 | 一个两栏的框，一边是图片，另一边是描述性文字，例如 facebook 上的帖子或推文。 | CSS 网格、float 回落、fit-content 尺寸 |
| 栏目布局 | 多栏、弹性盒或网格布局的取舍 | CSS 网格、多栏布局、弹性盒布局 |
| 元素居中 | 如何水平或者垂直居中内容。 | 弹性盒布局、盒子对齐 |
| 粘性页脚 | 创建一个页脚，当内容较短时，该页脚位于容器或视图的底部。 | CSS 网格、弹性盒 |
| 分离导航 | 一种导航模式，其中一些链接在视觉上与其他链接分开。 | 弹性盒、margin |
| 面包屑导航 | 创建链接列表，允许访问者在页面层次结构中向上导航。 | 弹性盒 |
| 含有计数徽章的列表 (en-US) | 一个带有 count 计数的徽章的 items 列表。 | 弹性盒、盒子对齐 |
| 分页 (en-US) | 链接到内容的某个页面（比如搜索结果）。 | 弹性盒、盒子对齐 |
| 卡片 | 卡片组件，显示在卡片网格中 | CSS 网格 |
| 网格包装器 (en-US) | 用于在一个中央包装器内对齐网格内容，同时也允许项目脱离。 | CSS 网格 |
贡献布局专题
作为 MDN 的一员，我们希望你能贡献一份与上表所示相同格式的布局专题。参见本页以获得编写示例的模板和指南。