CSS（二）选择器

声明语法

由选择器和声明组成：选择器 {属性1:值1; 属性2:值2; ...}，如

h1 {
    color:blue;
    font-size:12px;
}

选择器类型

• 全局选择器，优先级最低，一般做初始化，以通配符 * 匹配所有标签：* {声明1;声明2}，

* {color:red;}

• 元素选择器，以HTML的标签做选择器，适配所有这个类型的标签，如 p, img, span 等

• 类选择器，以 . 定义样式，在标签处使用class引用，同一个标签可以引用多个类选择器，用空格隔开

# css声明
.class_1{
            color: blue;
        }
# css使用
<span class="class_1">类选择器使用</span>
<span class="class_1 class_2">类选择器使用</span>

• id选择器，针对某一个特定标签使用，只能使用一次，以 # 定义，id是唯一的不能重复。标签使用属性id引用

#id_css{
            color: yellow;
        }
<span id="id_css">id选择器</span>

• 合并选择器，不同选择器样式相同：选择器1,选择器2,...{声明}

.class_1,.class_2{
            color: blue;
        }

优先级

内联>id选择器>类选择器>元素选择器

关系选择器

• 后代选择器，语法 E F{}，适用被E标签包含的所有F标签，中间空格隔开

ul li{
    color:red;
}

• 子代选择器，语法 E>F{}，只作用于E标签下第一级的F标签，用 > 隔开

div>a{
    color:red;
}

• 相邻兄弟选择器，语法 E+F{}，E和F相邻，且只作用于E后面的第一个F标签

h1+p{
    color:red;
}

• 通用兄弟选择器，语法E~F{}，作用于E后面的所有F标签

h1~p{
    color:red;
}