CSS类为您提供了额外的灵活性，用于指定要接收特定样式的元素。
前几节课，我们了解了选择器。您可能还记得，选择器是我们应用样式所针对的东西。在我们的示例中，我们的选择器都是HTML元素。例如，我们决定将<h1>元素设置为蓝色。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
现在，如果您希望所有标题都为蓝色，则效果很好。但是，如果您只想将某些标题设置为蓝色，该怎么办？也许您希望标题的颜色反映您所在的网站部分。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
听起来你需要使用类！文章源自你的网络首码项目网-https://www.youranweb.com/252.html
在CSS中，类允许您将样式应用于元素的给定类。为此，可以通过声明类的样式，然后将该类分配给该元素，将元素链接到样式。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
类语法
通过使用点（.）后跟类名来声明CSS类。您自己编造类名。在类名之后，您只需输入要分配给类的属性/值。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
.class-name { property:value; }如果要对多个元素使用相同的类名，但每个元素具有不同的样式，则可以在点前面加上HTML元素名称。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
例如：文章源自你的网络首码项目网-https://www.youranweb.com/252.html
p.large { font-size: 2em; }示例
<!DOCTYPE html>
<title>Example</title>
<style>
div.css-section {
border:1px dotted red;
padding: 20px;
}
p.css-section {
color:green;
}
</style>
<div class="css-section">CSS Class</div>
<p class="css-section">CSS classes can be very useful</p>还可以选择嵌套在另一个元素或类中的元素（或类）。例如，将选择嵌套在使用该类的<div>元素中的所有<p>元素。div.css-section p.css-section文章源自你的网络首码项目网-https://www.youranweb.com/252.html
这样做的一个主要好处是，当元素嵌套在使用类的另一个元素中时，不需要将类应用于元素的每个实例。文章源自你的网络首码项目网-https://www.youranweb.com/252.html
下面是一个示例：文章源自你的网络首码项目网-https://www.youranweb.com/252.html
<!DOCTYPE html>
<title>Example</title>
<style>
div.css-section {
border:1px dotted red;
padding: 20px;
}
div.css-section p {
color:green;
}
</style>
<div class="css-section">CSS Class
<p>CSS classes can be very useful</p>
</div>文章源自你的网络首码项目网-https://www.youranweb.com/252.html文章源自你的网络首码项目网-https://www.youranweb.com/252.html
评论