前端 选择器

前端中选择器的种类有很多：id选择器  class选择器  兄弟选择器  包含选择器   选择器组合等。

css语法：

selector{

property1:value1;

property2:value2;

...:...;

}

具体用法：

/*元素选择器 E{}*/


 div {
    background: red;
}
*{
    margin:0;
    padding:0
} //全部的都被选中


/* 属性选择器 E[attr]{}*/


/*div[id^=zz] {
    background: red;
}*/表示前缀带有zz的


/*div[id$=zz] {
    background: red;
}*/


/* div[id*=zz] {
    background: red;
} 所有带zz的


/*div[id=zz] {
    background: red;
}*/只选择一个是zz的


/* id选择器 */


/* #zz {
    background: linear-gradient(90deg, red, blue, yellow);
} */ID是zz的


/* class选择器 */


/* .gs {
    background: magenta;
} */class选择器没有空格


/* 包含选择器 selector1 selector2{} */


/* div .gs {
    background: red;
} */包含选择器有空格


/* 子选择器 selector1>selector2{}*/


/* div>div>p {
    background-color: red;
} */


/* 兄弟选择器 selector1~selector2{} 只找弟弟，不找哥哥*/


/* .java~.php {
    background: red;
} */


/* 选择器的组合  selector1,selector2,...{} */


/* div,
p,
span {
    background: red;
} */