一、什么是CSS选择器？
定位HTML元素的追踪工具。
二、目录
CSS元素选择器
CSS id 选择器
CSS 类选择器
CSS通用选择器
一、 CSS 元素选择器
元素的名称叫什么，就用它的名字召唤它！
学生的名字叫什么，老师就用他的名字点他的名！
狗的名字叫什么，主人就用它的名字叫它！或许它还能应答呢！
总而言之，目的是用名称——找到元素！
<style> h1,p{ text-align: right; color: greenyellow; } p{ text-align: center; color:black; } </style><body> <h1>看我，我在右边！</h1> <p>我占中间位置。</p> <p>我也在中间！</p> </body>
二、CSS id 选择器
id 是每一个元素唯一的标识！页面中只有唯一的一个！
身份证号码是每一个中国人的唯一标识！全中国这一个身份证号码只能代表特定的一个人！
我们用一张身份证卡，结合身份证号码，给人的信息编辑上去。
我们用（#）这个符号，结合 id 属性的属性值，找到唯一那个元素，给它编个详细信息。
很多人的名字可以叫张三，但是每个张三的身份证号码都不一样。
很多元素的名字都叫<p> ，但是一个页面中它们的id都不一样，都很别致。
<style> #pbaby{ text-align: center; background-color: black; color: white; } </style><body> <p id="pbaby">我唯一的pp宝贝啊~</p> <p>我是p段落，嘿嘿</p> </body>
注意：id名称不能以数字开头；妈的不给我设置CSS样式，你个坏蛋！
三、CSS 类选择器
人类，好人坏人残疾人，都是人。
把元素放到一个类里，相当于塞进一个盒子里去，给这个盒子命名为“people”
1、我对这个盒子做了一些操作，打它骂它亲它，盒子里的<p><p><div>都是同等待遇。
找到这个类下的元素，用（.）访问这个元素集体。
<style> .people{ text-align: center; background-color: orange; color: white; } </style>
<body> <p class="people">我是坏蛋！</p> <p class="people">我是好人，你不用害怕！</p> <div class="people">我是残障人士</div> </body>
2、指定特定的HTML元素受到class的影响。
class 是个大类
类中有各种元素小类
对特定的HTML类进行操作，只让它们享受被打被骂被亲的操作。
召唤元素名称+对应类名=某个类下的某元素集体
<style> p.people{ text-align: center; background-color: orange; color: white; } </style>
3、先找到具体的class类，再找到类下的元素小弟
<style> p.bad{ text-align: center; background-color: orange; color: white; } p.good{ text-align: left; background-color: black; color: white; } .box{ font-size: 200%; } </style><body> <p class="bad">我是坏蛋！</p> <p class="good">我是好人，你不用害怕！</p> <div class="box">我是残障人士</div> </body>
四、CSS 通用选择器
页面上的所有HTML元素，一个都不放过！！！
<style> *{ text-decoration: overline; font-size: 100%; color: brown; text-align: center; } </style><body> <p>别动我！</p> <p>救命！</p> <p id="badguy">Oh No ！！！</p> </body>
扫一扫
4584
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
