[分享]css六类选择器

CSS选择器是用来寻找HTML文档中各个元素的一种方法。CSS选择器有六类，我们来一一介绍。1. 标签选择器p { color: red; } 标签选择器是按HTML标签名选择元素，上面这个例子就是选...

CSS选择器是用来寻找HTML文档中各个元素的一种方法。CSS选择器有六类，我们来一一介绍。

1. 标签选择器

p {
  color: red;
} 

标签选择器是按HTML标签名选择元素，上面这个例子就是选择所有的<p>元素并把它们的颜色设置为红色。

2. 类选择器

.red {
  color: red;
} 

类选择器以.开头，后面是类名。上面这个例子就是给所有class属性为"red"的元素设置颜色为红色。

3. ID选择器

#main {
  width: 80%;
} 

ID选择器以#开头，后面是ID名。上面这个例子就是选择ID为"main"的元素并将它的宽度设置为80%。

4. 属性选择器

a[target="_blank"] {
  color: blue;
} 

属性选择器用来选择有指定属性的元素。上面这个例子是选择所有target属性值为"_blank"的<a>元素并将它们的颜色设置为蓝色。

5. 子元素选择器

ul > li {
  font-weight: bold;
} 

子元素选择器用于选择某个元素的直接子元素。上面这个例子是选择ul元素下所有的直接子元素li并将它们的字重设置为粗体。

6. 后代元素选择器

ul li {
  list-style-type: square;
} 

后代元素选择器用于选择某个元素的后代元素，无论它们是在多少级下。上面这个例子是选择ul元素下所有的li元素并使用方块符号作为列表类型。