类选择器
Coddy CSS 选择器 课程的第 4 课,共 15 课。
类选择器是一种 CSS 选择器,用于选择具有特定类属性的元素。类属性是一种自定义属性,你可以添加到 HTML 元素中,将它们组合在一起。
要选择具有特定类的元素,可以使用句点(.)后跟类名。例如,选择器 .my-class 会选择所有具有 my-class 类的元素。
下面是使用类选择器设置网页样式的示例:
.my-class {
color: red;
font-size: 2em;
}要为元素添加类,请写入:
<div class="my-class"></div>这条 CSS 规则会将所有具有 my-class 类的元素设置为红色,并将字体大小设为 2em。
挑战
简单- 创建一个包含三个
h1元素的网页。 - 为第一个
h1元素添加一个类。 - 为第二个
h1元素添加另一个类。 - 使用 CSS 类选择器将第一个
h1元素的样式设为红色 ,并将字体大小设为 64px。 - 使用另一个 CSS 类选择器将另一个
h1元素的样式设为蓝色 ,并将字体大小设为 32px。
亲手试试
<html>
<head>
<title>Class Selector Exercise</title>
<style>
/* CSS Code goes here */
</style>
</head>
<body>
</body>
</html>
CSS 选择器中的所有课
自己练习: Web 在线编辑器