CSS字体与背景属性全解析：初学者必备指南

本文档是一份全面的CSS字体属性和背景属性参考指南，专为初学者设计。首先，我们来看看字体属性部分： 1. **字体大小** (font-size): CSS提供了多种尺寸选择，如`x-large`（特大）、`xx-small`（极小），通常中文设计者很少使用极小字号，因为中文字符通常不会像英文那样需要大量的大小变化。数值单位包括像素(PX)和磅(PD)，例如`font-size: 16px`或`font-size: 1rem`。 2. **字体样式** (font-style): 支持三种样式：`oblique`（偏斜体）、`italic`（斜体）和`normal`（正常）。斜体是文本倾斜，常用于强调或特定效果。 3. **行高** (line-height): 设置文本行之间的距离，`normal`表示默认值，可以指定为像素、磅或相对单位`em`。比如`line-height: 1.5`会使行距为字符高度的1.5倍。 4. **粗细** (font-weight): 控制字体的粗细程度，有`bold`（粗体）、`lighter`（较细）、`normal`（正常）等选项。对于自定义权重，可以使用百分比或者`bolder`和`lighter`。 5. **变体** (font-variant): `small-caps`使小写字母变为大写，`normal`保持不变。 6. **大小写转换** (text-transform): 可以改变文本的初始字符大小写，如`capitalize`（首字母大写）、`uppercase`（全大写）、`lowercase`（全小写）以及`none`（不改变）。 7. **修饰** (text-decoration): 包括`underline`（下划线）、`overline`（上划线）、`line-through`（删除线）和`blink`（闪烁效果，现代浏览器已不支持）。 8. **常用字体** (font-family): CSS允许设置一系列字体供浏览器优先选择，如`Arial`, `Helvetica`, `sans-serif`等，如果系统没有这些字体，会尝试后续列表中的字体。 接下来是背景属性： 1. **背景颜色** (background-color): 使用颜色代码如`#FFFFFF`来设定背景色。 2. **背景图片** (background-image): 使用`url()`函数添加背景图片，支持URL链接。 3. **背景重复** (background-repeat): 决定图片是否平铺，有`no-repeat`（不重复）、`repeat`（重复）、`repeat-x`（水平重复）和`repeat-y`（垂直重复）。 4. **背景固定或滚动** (background-attachment): 决定背景是否随页面滚动，`fixed`使背景固定，`scroll`使其滚动。 5. **背景位置** (background-position): 控制图片在背景中的位置，可以分别指定水平(`left`、`right`等)和垂直(`top`、`bottom`等)。 6. **简写方法** (background): 使用简写语法将多个背景属性组合在一起，便于快速设置。 7. **区块属性** (Block, 未详述): 提到但未详细解释的区块属性可能涉及到元素的块级布局或定位，需要深入研究CSS盒模型和布局理论。 8. **字间距** (letter-spacing): 调整字符间的间距，`normal`是默认值，可指定数值。 9. **文本对齐** (text-align): 有`justify`（两端对齐）、`left`（左对齐）、`right`（右对齐）和`center`（居中）等选项。 10. **缩进** (text-indent): 用于设置段落或列表项目的首行缩进。 11. **垂直对齐** (vertical-align): 设置行内元素的垂直对齐方式，如`baseline`（基于基线对齐）。 以上这些CSS属性是网页设计中非常基础且重要的元素，掌握它们能帮助你创建出美观且响应式的网页布局。对于初学者来说，理解并熟练运用这些属性是提升网页设计技能的关键步骤。同时，实践和不断查阅文档以熟悉简写方法和特殊用法也是不可或缺的环节。