| 命令 / 语法 | 说明 | 分组 | |
|---|---|---|---|
| 布局 (12 条) | |||
| display: flex | 弹性盒子布局（一维） | 布局 | |
| display: grid | 网格布局（二维） | 布局 | |
| display: block / inline | 块级 / 行内元素 | 布局 | |
| position: relative | 相对定位 | 布局 | |
| position: absolute | 绝对定位（相对最近定位祖先） | 布局 | |
| position: sticky | 粘性定位（滚动吸顶） | 布局 | |
| grid-template-columns | 定义网格列 | 布局 | |
| grid-template-rows | 定义网格行 | 布局 | |
| gap | 网格/弹性间距 | 布局 | |
| flex-direction | 主轴方向 | 布局 | |
| justify-content | 主轴对齐 | 布局 | |
| align-items | 交叉轴对齐 | 布局 | |
| 盒模型 (7 条) | |||
| margin | 外边距 | 盒模型 | |
| padding | 内边距 | 盒模型 | |
| border | 边框 | 盒模型 | |
| box-sizing: border-box | 盒模型包含 padding+border | 盒模型 | |
| width / height | 宽高 | 盒模型 | |
| max-width / min-width | 宽高限制 | 盒模型 | |
| overflow: hidden / auto / scroll | 溢出处理 | 盒模型 | |
| 文本 (6 条) | |||
| font-family | 字体族 | 文本 | |
| font-size | 字号 | 文本 | |
| font-weight | 字重 | 文本 | |
| line-height | 行高 | 文本 | |
| text-align | 文本对齐 | 文本 | |
| color | 文本颜色 | 文本 | |
| 动画 (3 条) | |||
| transition | 过渡动画 | 动画 | |
| animation + @keyframes | 关键帧动画 | 动画 | |
| transform: translate/scale/rotate | 2D/3D 变换 | 动画 | |
| 响应式 (3 条) | |||
| @media (max-width: 768px) | 媒体查询（响应式断点） | 响应式 | |
| vw / vh / vmin / vmax | 视口单位 | 响应式 | |
| clamp(min, ideal, max) | 弹性取值（响应式字号） | 响应式 | |
| 变量 (5 条) | |||
| --my-var | 定义 CSS 自定义属性 | 变量 | |
| var(--my-var) | 引用 CSS 变量 | 变量 | |
| calc() | 运行时计算 | 变量 | |
| min() / max() | 取最小/最大值 | 变量 | |
| color-mix() | 颜色混合 | 变量 | |
看完了 CSS 属性？
还有 4 大类共 136 条速查等你查阅。