CSS 可以定义页面的布局、字体、颜色、背景图像等等，可以为每个元素添加不同的效果，例如：鼠标悬停时的反应、单击后产生的效果、向下滚动页面时的效果等等，这些都可以通过 CSS 来实现。
.example {
color: red;
background-color: #F9F9F9;
font-family: Arial, sans-serif;
font-size: 18px;
}上面这段代码是一段简单的 CSS 样式代码。它定义了一个名为 example 的样式集合，该样式集合将文字的颜色设置为红色，背景色设置为 #F9F9F9，字体设置为 Arial 或 sans-serif，字体大小为 18 像素。
在 CSS 中，样式集合可以通过三种方式定义：
1. 直接在 HTML 元素中定义样式集合：
<div>内容</div>
2. 在 style 标签内定义样式集合：
<style>
.example {
color: red;
}
</style>3. 在单独的 CSS 文件中定义样式集合：
.example {
color: red;
}然后在 HTML 中引入该文件：
<link rel="stylesheet" href="example.css">
使用 CSS 的好处之一是可以将样式应用于多个元素。例如：
<div class="example">内容1</div> <div class="example">内容2</div> <div class="example">内容3</div>
这将把样式应用于所有<div>元素，因为它们的 class 属性设置为 example。
CSS 还有一些高级用法，例如伪类、伪元素和 @media 查询等。这些用法可以让您更好地控制元素的样式和布局。了解这些特性将使您更具效率地使用 CSS，进而设计更吸引人的网站。