27、深入理解与应用级联样式表（CSS）

深入理解与应用级联样式表（CSS）

1. CSS 样式类型概述

在网页设计中，CSS 样式有多种类型，每种类型都有其独特的用途和特点。以下是几种常见的 CSS 样式类型：
| 图标颜色 | 类型 | 描述及示例 |
| — | — | — |
| 黄色 | 内联样式（Inline） | 最简单的样式类型，仅影响定义它的标签。当你不打算在其他地方重复使用此样式时，可以使用这种类型。示例： <p style="text-align: center;"> |
| 蓝色 | 元素样式（Elements） | 影响页面上指定元素（标签）的所有实例。示例： body { font-family: "Trebuchet MS", Verdana, Arial; } |
| 绿色 | 类样式（Classes） | 应用于引用它的元素。示例： .ms - quicklaunch { background - color: #d6e8ff; } ，引用该样式的标签类似这样： <div class="ms - quickLaunch"> |
| 红色 | ID 样式（IDs） | 每页只能使用一次，通常用于结构元素。示例： #page_content { font - weight: 700; } ，引用该样式的标签类似这样： <div id="page_content"> |
| 灰色圆圈 | 使用中的样式（Style in use） | 如果样式在页面上被