CSS选择器
以下内容只是 CSS2 标准中支持的选择器
CSS基础选择器
标签选择器
特点：
- 能快速为同一类型的标签都选择出来
- 但是不能差异化选择
<style>
div{color: hotpink;}p{color: red;}
</style>
</head>
<body>
<div>好好学习</div>
<div>天天向上</div>
<p>好好学习</p>
<p>天天向上</p>
显示效果：
类选择器
特点：
- 差异化表示不同的标签
- 可以让多个标签的都使用同一个标签
<head>
<style>
div{color: hotpink;}p{color: red;}.green{color: seagreen;}
</style>
</head>
<body>
<div class="green">好好学习</div>
<div>天天向上</div>
<p class="green">好好学习</p>
<p>天天向上</p>
</body>
显示效果：
语法细节：
- 类名用 . 开头的
- 下方的标签使用 class 属性来调用
- 一个类可以被多个标签使用, 一个标签也能使用多个类（多个类名要用空格分割，这种做法可以让代码更好复用）
- 如果是长的类名, 可以使用 - 分割
- 不要使用纯数字, 或者中文, 以及标签名来命名类名
id选择器
和类选择器相似
- CSS 中使用 # 开头表示 id 选择器
- id 是唯一的, 不能被多个标签使用 (是和 类选择器 最大的区别)
- html 的元素id不需要代#
- id 选择器的值和 html 中某个元素的 id 值相同
<style>
#red{color: red;}
</style>
<div id="red">红色的字</div>
类比：
姓名是类选择器，可以重复
身份证号码是id选择器，是唯一的
通配符选择器
使用 * 的定义，选取所有的标签
*{color: red;}
不需要被页面结构调用
本文转载自: https://blog.csdn.net/weixin_53912554/article/details/123134712
版权归原作者 早晨下小雨_ 所有， 如有侵权，请联系我们删除。
版权归原作者 早晨下小雨_ 所有， 如有侵权，请联系我们删除。