CSS3基础样式及习题答案

简介：
本书为初学者提供全面的CSS3基础知识讲解与实践练习，并包含详细的习题答案解析，帮助读者快速掌握现代网页设计技能。 CSS3是层叠样式表技术的最新版本，自1999年开始制定以来，它已包含了丰富的模块与功能，极大地提升了网页设计的灵活性和表现力。2001年5月23日W3C完成了其工作草案，并将主要分为以下七个模块： 1. **盒子模型**：包括内容、内边距、边框及外边距等元素在页面中的空间占用与排列方式。 2. **列表模块**：提供了对列表项的样式控制，如列表符号和间距。 3. **超链接方式**：改进了不同状态下的链接（未访问、已访问、悬停或活动）的外观表现。 4. **语言模块**：允许为特定的语言文本设置不同的样式。 5. **背景与边框**：增加了多种背景图像、颜色和边框类型，如圆角边框及阴影效果等。 6. **文字特效**：包括了诸如文本阴影、装饰以及溢出显示等功能的实现方式。 7. **多栏布局**：使得复杂的页面结构设计变得更为简单，例如可创建列数不同的布局方案。 以下是一些CSS3选择器的基本介绍： ### 一、基本选择器 - **通配符选择器（*）**：用于清除所有元素默认的边距和填充。 - **元素选择器（E）**：为特定HTML标签设置样式，如`li{border:1px solid #000;}`给每个列表项添加一个黑色实线框。 - **类选择器（.className）**：通过指定类名来定义样式的应用范围。 - **ID选择器（#ID）**：根据唯一的元素标识符设置样式。 ### 二、组合选择器 - **后代选择器 (E F)**: 如`.demo li`，用于选取属于`.demo`类的任何列表项。 - **子元素选择器 (E > F)**: 如`ul > li`, 只针对直接位于无序列表内的项目应用样式。 - **相邻兄弟选择器（E + F）**：如 `li + li` 仅适用于紧跟在其他列表项之后的所有同级列表项。 - **通用兄弟选择器 (E ~ F)**: 如`.active ~ li`, 应用于紧随于具有 `.active` 类名的元素后的所有同级列表项。 - **群组选择器（selector1, selector2,...）**: 将多个指定的选择符组合在一起，如`.first,.last`。 ### 三、属性选择器 - **E[attr]**：例如使用 `a[id]` 来选取带有 id 属性的链接元素。 - **E[attr=value]**: 如 `.demo a[href=index.html]`, 筛选具有特定 href 值的所有链接。 - **E[attr~=value]**: 选择包含指定关键字（如“website”）于其属性值内的元素，例如 `a[title~=website]`。 - **E[attr^=value]**：选取以给定字符串开头的属性值，比如 `.demo a[href^=http]`. 这些选择器极大地丰富了CSS的功能，并使我们能更精确地定位和控制网页中的样式。然而，在使用高级选择器时需注意其在某些老旧浏览器（如IE6）上的兼容性问题。