CSS选择器的常见用法(标签选择器,class选择器,id选择器,复合选择器,通配符选择器)

1. 标签选择器

/* 选择所有的 a 标签 , 设置颜⾊为红⾊ */

a {

color : red;

}

/* 选择所有的 div 标签 , 设置颜⾊为绿⾊ */

div {

color : green;

}

2. class选择器

/* 选择 class 为 font32 的元素 , 设置字体⼤⼩为 32px */

.font32 {

font-size : 32px ;

}

⼀个类可以被多个标签使⽤, ⼀个标签也能使⽤多个类(多个类名要使⽤空格分割, 这种做法可以让 代码更好复⽤)

3. id选择器

/* 选择 id 为 submit 的元素 , 设置颜⾊为红⾊ */

#submit {

color : red;

}

id 是唯⼀的, 不能被多个标签使⽤ (是和 类选择器 最⼤的区别)

4. 复合选择器

/* 设置⻚⾯所有元素 , 颜⾊为红⾊ */

* {

color : red;

}

5. 通配符选择器

/* 只设置 ul 标签下的 li 标签下的 a 标签 , 颜⾊为红⾊ */

ul li a {

color : blue;

}