W3cSchool: CSS2参考手册 - 背景与边框详解

需积分: 11 6 下载量 169 浏览量 更新于2024-09-18 收藏 95KB PDF 举报
W3cSchool 的《DIV+CSS2_参考手册》是一本详细介绍CSS(层叠样式表)技术的重要参考资料,特别是在处理HTML元素布局与美化方面。该手册特别关注于CSS2版本中的两个关键特性:背景和边框。 **CSS 背景属性** 1. **background** - 简写属性,允许同时设置背景颜色、图像、重复方式、附着方式和位置。通过这个属性,开发者能够一次性定义丰富的背景效果。 2. **background-color** - 设置元素的背景颜色,支持多种颜色表示法,如RGB(颜色-红绿蓝值)、十六进制(颜色-#RRGGBB)和预定义颜色名(如`transparent`)。 3. **background-image** - 定义背景图像,使用`url`指定图像源,`none`表示没有背景图像。此外,还提供了几种定位方式,如`topleft`、`center`等。 4. **background-repeat** - 控制背景图像的重复方式,有`repeat`(默认,图像按原尺寸填充整个背景区域)、`repeat-x`(沿水平方向重复)、`repeat-y`(沿垂直方向重复)和`no-repeat`(不重复)。 5. **background-attachment** - 设置背景图像是否随文档内容滚动。`scroll`表示跟随滚动,`fixed`使图像固定在视口。 6. **background-position** - 设置背景图像的起始位置,支持百分比和具体位置关键词。 **CSS 边框属性 (border)** 1. **border** - 简写属性,用于一次设定所有边框的宽度、样式和颜色。 2. **border-width** - 分别设置上、右、下、左四条边框的宽度,也可用简写形式。 3. **border-style** - 设置边框样式,包括`none`(无边框)、`hidden`(隐藏)、`dotted`(点线)、`dashed`(虚线)、`solid`(实线)、`double`(双线)、`groove`(沟槽)、`ridge`(脊状)、`inset`(内凹)和`outset`(外凸)。 4. **border-color** - 设置边框颜色,可以设置单个颜色,也可以针对每个边框分别设置。 5. **border-bottom**、**border-left** - 简写属性,分别针对底部和左边的边框设置宽度、样式和颜色。 掌握这些CSS2的基本概念和属性,对于创建出响应式、美观且功能丰富的网页布局至关重要。通过灵活运用背景和边框属性,开发人员能够实现各种视觉效果,提升网站设计的专业性和用户体验。熟练应用这些知识,无论是在网页开发初学者阶段还是高级设计师手中,都能发挥关键作用。