CSS3 快速参考指南

"CSS3 速查手册，包含了CSS3中关于背景、边框等关键属性的详细信息，适合快速查询和参考。" 在CSS3中，我们拥有了更丰富的样式控制能力，特别是在背景和边框方面。以下是这些知识点的详细说明： ### 背景（Background） **background**: 这个综合属性允许你一次性设置所有背景相关的属性，包括颜色、图像、位置、大小、重复方式、附件等。 **background-image**: 用于定义背景图片，可以是URL或者`none`表示无图片。 **background-position**: 控制背景图片的位置，可以使用关键词如`top left`，也可以使用百分比或长度值来精确定位。 **background-size**: 定义背景图片的大小，可以是长度值、百分比，或者`cover`（填充整个容器并保持宽高比）和`contain`（在不改变原图宽高比的情况下，尽可能大但不超过容器）。 **background-repeat**: 控制背景图片的重复方式，如`repeat`（水平和垂直重复）、`repeat-x`（仅水平重复）、`repeat-y`（仅垂直重复）或`no-repeat`（不重复）。 **background-attachment**: 指定背景图片是否随滚动条移动，可选`scroll`（默认，随页面滚动）或`fixed`（固定在视口）。 **background-origin**：设定背景图片的位置起点，有`border-box`（以边框盒为起点）、`padding-box`（以内边距盒为起点）和`content-box`（以内容盒为起点）。 **background-clip**: 控制背景显示范围，可选`border-box`（背景延伸至边框）、`padding-box`（背景延伸至内边距边缘）、`content-box`（背景只在内容区域显示）或`no-clip`。 **background-color**: 设置背景颜色，可以是颜色名、RGB、RGBA、HSL、HSLA等。 ### 边框（Border） **border-top**: 一个简写属性，用于同时设置上边框的宽度、样式和颜色。 **border-top-width**: 设置上边框的宽度，可以是`thin`、`medium`、`thick`或具体长度。 **border-style**: 定义边框的样式，如`solid`、`dashed`、`dotted`、`double`等。 **border-color**: 设置边框的颜色，可以是颜色名、RGB、RGBA、HSL、HSLA等。 **border-top-color**: 特指上边框的颜色。 **border-width**: 简写属性，用于同时设置四边边框的宽度。 **border-radius**: 用于创建圆角边框，可以指定每个角落的半径，或者使用简写形式如`border-radius: 10px`设置所有角的相同半径。 这只是CSS3中的一部分内容，实际上还有更多关于文本、布局、过渡、动画、选择器等的丰富特性，使得网页设计更加灵活多样。这份CSS3速查手册是开发者日常工作中不可或缺的参考资料，帮助快速查找和应用各种样式规则。