2.3.1 CSS 选择器

CSS选择器详解

最新推荐文章于 2025-12-04 00:13:33 发布

原创最新推荐文章于 2025-12-04 00:13:33 发布 · 887 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css #class #div #float #border

本文介绍了CSS选择器的各种使用方法，包括基本的选择器如标签选择器、类选择器、ID选择器，以及更复杂的组合选择器和伪类选择器。通过实例展示了如何精确地定位和修饰页面元素。

2.3.1 CSS 选择器
我们可以附加一个样式给标签，也可以在上下文中界定他们。有几种方式可以在上下文应用：标签的tyle，定义class，或者元素id.首先来看看标签类型的示例，定义div中的h1标签的样式：div h1 { color: red; }这里是以元素为基础的，也可以不针对某一个元素，单独定义一个class,例如：.callout { border: solid blue 1px; background-color: cyan }
如果将它定义到一个div中，需要的是<div>I'll appear as a normal bit of text</div>
<div class='callout'>And I'll appear as a callout!</div>
也可以联合定义：div.prose span.highlight { background-color: yellow }
还可以用标签id控制：
#close { color: red }
伪类：*:first-letter {
font-size: 500%;
color: red;
float: left;
}
p.illuminated:first-letter {
font-size: 500%;
color: red;
float: left;
a:hover{ color:yellow; }
}