CSS速查表：核心属性与选择器解析

"Cheat Sheet of CSS" 在网页设计中，CSS（层叠样式表）是一种强大的工具，用于控制网页元素的布局、颜色、字体、大小等视觉效果。本CSS速查表是一份综合性的指南，涵盖了CSS 2.1标准中的所有选择器和属性，旨在帮助开发者快速查找和理解各种CSS特性。 一、选择器与伪类/伪元素 1. Pseudo-Selectors（伪类）：`:first-child` 用于选取文档中第一个子元素；`:hover` 适用于元素鼠标悬停时的状态；`:active` 表示元素被激活（如点击）时的样式；`:focus` 指元素获取焦点时；`:link` 和 `:visited` 分别对应未访问和已访问的链接；`:lang(var)` 用于匹配指定语言的元素；`:before` 和 `:after` 可在元素前后插入内容。 2. Pseudo-Classes（伪元素）：`:first-line` 作用于元素的第一行文本；`:first-letter` 用于元素的第一个字母；`:before` 和 `:after` 创建元素内部的伪元素。 二、尺寸 - `width`、`min-width`、`max-width` 用于设置元素宽度的限制。 - `height` 控制元素的高度。 - `min-height` 和 `max-height` 设置元素高度的最小和最大值。 三、颜色/背景 - `color` 定义文本颜色，可以继承。 - `background` 是一个简写属性，用于设置背景的多个属性。 - `background-color` 设置元素的背景色。 - `background-attachment` 规定背景图是否随滚动条滚动。 - `background-image` 用于设置背景图像。 - `background-position` 定义背景图像的位置。 - `background-repeat` 控制背景图像是否及如何重复。 四、字体 - `font` 是一个简写属性，包括了 `font-family`、`font-style`、`font-variant`、`font-weight`、`font-size` 和 `line-height`。 - `font-family` 定义字体系列。 - `font-style` 可以设置斜体（`italic`）或正常（`normal`）。 - `font-variant` 控制小型大写字母。 - `font-weight` 设置字体的粗细。 - `font-size` 设定文本的大小。 - `font-size-adjust` 保持跨设备的字体比例。 - `word-spacing` 和 `letter-spacing` 分别调整单词和字母间的距离。 五、文本 - `text-indent` 设置首行缩进。 - `text-align` 控制文本对齐方式。 - `text-decoration` 添加下划线、上划线或删除线。 - `text-shadow` 为文本添加阴影效果。 - `orphans` 和 `widows` 规定页面断行规则。 - `line-height` 设置行间距。 - `vertical-align` 控制元素的垂直对齐方式。 六、其他属性 - `content` 在伪元素中插入内容。 - `quotes` 定义引号的样式。 - `counter-reset` 和 `counter-increment` 用于计数器操作。 - `list-style` 管理列表项的符号或图片。 - `size` 用于分页样式，设定纸张大小。 - `marks` 控制打印时的页眉和页脚标记。 - `page-break-before` 规定元素之前是否添加分页符。 这份CSS速查表提供了一个全面的参考，方便开发者快速查找并应用CSS属性，提升开发效率。通过理解和熟练运用这些属性，你可以创建出更具吸引力和功能性的网页设计。