ID 选择器：
ID 选择器用于选择具有特定 ID 的元素。在 HTML 中，通过 id 属性为元素指定唯一的标识符。
#header {
color: blue;
font-size: 20px;
}
上面的例子中，选择器 #header 选择了具有 id="header" 的元素，并为其定义了颜色和字体大小。
类选择器：
类选择器用于选择具有特定类的元素。在 HTML 中，通过 class 属性为元素指定一个或多个类名。
.highlight {
background-color: yellow;
font-weight: bold;
}
上面的例子中，选择器 .highlight 选择了具有 class="highlight" 的元素，并为其定义了背景颜色和加粗字体。
使用示例：
HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>ID and Class Selectors</title>
</head>
<body>
<div id="header">This is the header</div>
<p class="highlight">This paragraph is highlighted.</p>
<p>This is a normal paragraph.</p>
</body>
</html>
CSS（styles.css）：
#header {
color: blue;
font-size: 20px;
}
.highlight {
background-color: yellow;
font-weight: bold;
}
在上面的示例中，#header 选择器选择了具有 id="header" 的元素，而 .highlight 选择器选择了具有 class="highlight" 的元素。这两个选择器分别为这两个元素应用了不同的样式。
转载请注明出处：http://www.pingtaimeng.com/article/detail/12519/CSS