CSS 标签选择器
要想对 HTML 文档的元素,使用 CSS 美化样式,那么需要选择对应的 HTML 元素,才能针对它们编写 CSS 属性。CSS 选择器有标签选择器、Class 选择器、ID 选择器、伪类选择器、伪类选择器,和组合选择器等,这一小节我们先看一下最简单的标签选择器。
CSS 标签选择器的使用方法
CSS 标签选择器用于选择个特定的 HTML 元素标签,例如 div
、p
或 a
等,选择之后,会对所有符合条件的 HTML 元素应用样式。假设我们有这样的 HTML 结构:
<nav>
<a href="#">导航链接1</a>
<a href="#">导航链接2</a>
<a href="#">导航链接3</a>
<a href="#">导航链接4</a>
</nav>
预览:
如果我们要想把 <a/>
标签的文字大小设置为 18px,并修改一下颜色,可以使用下面的 CSS 代码:
a {
font-size: 18px;
color: hsl(214deg, 50%, 60%);
}
预览:
可以看到 <nav>
标签下的 <a />
标签全部都选中了,并且也应用了对应的样式,这个就是标签选择器的特点,在这个示例中,它会选择 HTML 页面中所有的 <a>
。
小结
这个就是 CSS 标签选择器的作用和使用方法,它能够选择 HTML 页面中,所有指定的元素,然后对它们应用样式,一般适合编写一些通用的样式,或者默认的样式,在它基础上,再使用其它的选择器设置更特殊的样式。