本节重点
1.什么是选取器
每一条css样式声明由两部分构成，如下：
选取器{
样式;
}
在css中{}之前的部分便是"选取器","选取器"指明了{}中的”样式“的功效对象，亦便是说该”样式“功效与网页中的那些元素。
2.基本选取器
标签选取器
标签选取器顾名思义便是html代码中的标签。咱们之前学习的html、body、h系列的标签、p、div、img等等咱们都能够运用标签选取器来设置对应的css样式属性。
它能够选中页面中所有的元素，而不是某一个元素内容，因此选中的是页面中共有的属性
举个栗子：
为页面中所有的段落设置字号为12px,字体颜色为红色，字体粗细为更粗。
代码如下：
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
<style type=text/css>
p{
color:red;
font-size:12px;
font-weight:bold;
}
</style>
</head>
<body>
<h3>抖音</h3>
<p>年后，一股抖音风 火热了社媒，抖音上的博主带火了小猪佩奇。 她们的标志是"手带小猪佩奇手表，身披小猪佩奇纹身"，于是就诞生了"小猪佩奇身上纹，掌声送给社会人"。</p>
<img src="index01.jpeg" alt="">
<p>估计林俊杰 自己都没想过，《醉赤壁》一句最不起眼的台词竟然 成为了众多网友口中的一个梗，最优秀这个梗的完美结合。</p>
<img src="index02.jpeg" alt="">
</body>
</html> ID选取器
ID好比是每一个人的身份证号同样，每一个人都有身份证，并且身份证号是不同样的。在网页中所有的标签都能够设置id，并且id不可重复。
语法：
#ID选取器名叫作{
css样式代码;
}
重视：
1、以#开头
2、其中ID选取器名叫作能够任意起名(最好不要起中文)
3、ID的名叫作必要是独一的
ID选取器选中的是页面中元素特有的属性。
例如对上节课代码中的林俊杰文本来设置字体颜色为绿色，并且字体体积为14px。并且设置《醉赤壁》文本的字体体积亦为14px。那样仅仅靠标签选取器是完成不了的，咱们能够这般做。
运用过程如下：
1、运用合适(<span></span>)的标签把要修饰的内容标记出来，如下：
<span>林俊杰</span>
<span>《醉赤壁》</span>
2、运用id=id选取器名叫作为每一个标签设置区别的id。如下
<p>估计<span id="span1">林俊杰</span>自己都没想过，<span id="span2">《醉赤壁》</span>一句最不起眼的台词竟然成为了众多网友口中的一个梗，最优秀的要属毛爷爷的表情包和这个梗的完美结合。</p>
有的童鞋可能有疑问了？难道我不可给林俊杰,《醉赤壁》添加完span标签之后，直接设置你需求的样式么？大众会发掘，给文本所有设置为14px,并且设置了绿色，那样《醉赤壁》亦会变为绿色，这是不可满足需求的。因此咱们能够给每一个span设置区别的id，来分别设置区别的样式
3、设置ID选取器css样式，如下：
#span1{
color:green;
font-size:14px;
}
#span2{
font-size:14px;
}
类选取器
类选择器跟id有点类似，任何的标签元素都能够添加类(class)，然则区别的是类是能够重复，有“归类”的概念，并且同一个标签中能够携带多个类，用空格隔开。
例如狗、猫、刺猬属于动物类，黑白打印机和彩色打印机属于打印机类。一样状况下，例如网页中的某几个标签，像p、li、a标签同属于ac
| 
发表于 2024-6-30 11:03:05
