CSS样式表基础教程：字体与背景属性详解

"CSS样式表汇总新手专用" 在网页设计中，CSS（层叠样式表）是一种用于控制网页元素外观的关键技术。本汇总主要关注的是字体属性、背景属性以及区块属性，这些都是创建美观、易读页面的基本要素。 1. **字体属性(font)**： - **字体大小**：`font-size`属性用于设定文本的大小，如`x-large`或`xx-small`。通常中文网站使用数值配合单位（如PX、PT）来定义大小。 - **字体样式**：`font-style`可以设置为`oblique`（偏斜体）、`italic`（斜体）或`normal`（正常）。 - **行高**：`line-height`设定行间距，可以是`normal`或者指定数值，单位包括PX、PT、EM等。 - **字体粗细**：`font-weight`用于定义字体的粗细，如`bold`（粗体）、`lighter`（细体）和`normal`（正常）。 - **变体**：`font-variant`可设置为`small-caps`（小型大写字母）或`normal`（正常）。 - **大小写转换**：`text-transform`允许你控制文字的大小写形式，如`capitalize`（首字母大写）、`uppercase`（全大写）、`lowercase`（全小写）和`none`（无转换）。 - **修饰**：`text-decoration`定义文本的装饰，如`underline`（下划线）、`overline`（上划线）、`line-through`（删除线）和`blink`（闪烁），尽管`blink`在现代浏览器中已不推荐使用。 2. **常用字体(font-family)**：字体家族的设定是确保跨浏览器和跨平台一致性的关键。例如，`"CourierNew", Courier, monospace, "TimesNewRoman", Times, serif, Arial, Helvetica, sans-serif, Verdana` 这样的字体列表会依次尝试使用，如果浏览器不支持前面的字体，它将使用后面的字体。 3. **背景属性(background)**： - **背景颜色**：`background-color`用来设定元素的背景色，如`#FFFFFF`代表白色。 - **背景图片**：`background-image`通过`url()`引入背景图像。 - **背景重复**：`background-repeat`可以设定为`no-repeat`（不重复）、`repeat-x`（仅水平重复）、`repeat-y`（仅垂直重复）或`repeat`（两者都重复）。 - **背景滚动**：`background-attachment`控制背景是否随元素滚动，`fixed`表示固定，`scroll`表示随内容滚动。 - **背景位置**：`background-position`可以设置图像在背景中的位置，如`left top`表示左上角。 - **背景简写**：`background`属性允许你一次性设置所有背景属性，如`background: #000 url(..) repeat fixed left top;`。 4. **区块属性(Block)**： - **字间距**：`letter-spacing`定义字符之间的间距，`normal`表示默认值，也可以设置具体数值。 - **文本对齐**：`text-align`用于设置文本的对齐方式，如`justify`（两端对齐）、`left`（左对齐）、`right`（右对齐）和`center`（居中）。 - **缩进**：`text-indent`设置段落首行的缩进，通常使用像素值。 - **垂直对齐**：`vertical-align`控制元素在行内的垂直位置，`baseline`是默认值，还有其他选项如`top`、`bottom`等。 掌握这些基本CSS属性，能让你更有效地控制网页元素的显示，提升网页设计的专业性和用户体验。对于初学者来说，多实践和理解这些属性的用法是非常重要的，这将帮助你在创建网页时游刃有余。