css 选择器

标签：type   通配   pre   code   alt   inf   序号   ***   属性选择器   

普通选择器

/*标签选择器*/
div{
    color:#fff; 
}

/*类选择器*/
.class{
    color:#fff; 
}
/*id选择器*/
#id{
    color:#fff; 
}
/*通配符选择器*/
*{
   color:#fff; 
}

复合选择器

/*后代选择器*/
选择器 选择器{
     color：#fff；    
}
/*子代选择器*/
选择器>选择器{
     color：#fff；    
}

/*并集选择器  注意   选择器与选择器之间必须用逗号分割  2选择器标签的结构 可以是任意 */
选择器，选择器 {
     color：#fff；       
}
/*标签指定选择器*/
标签  选择器{
     color：#fff； 
} 
/*交集选择器*/

c3  选择器

1. 子代选择器

　　　　语法：

　　　　　　选择器>选择器{属性：值；}

　　　　注意：

　　　　　　必须是嵌套关系 

　　　　　　只是子代 后代则不会被选中

          2.属性选择器

　　　　　语法：

　　　　　　[属性名]{属性：值；}

　　　　　其他写法

　　　　　　[属性名=值]{属性：值；}  例子   [class="tow"]{color:green;}

　　　　　　[属性名^=值]{属性：值；}  例子   [class^=t]{color:green;}   当前这个标签这个属性   属性class=   值以t开头的选中

　　　　　　[属性名$=值]{属性：值；}  例子   [class$=t]{color:green;}   当前这个标签这个属性   属性class=   值以t结束的选中

　　　　　　[属性名*=值]{属性：值；}  例子   [class*=t]{color:green;}   当前这个标签这个属性   属性class=   值只要有t就会选中

 　　　3.伪类选择器

• • • 结构伪类

　　　　　　　　　　语法：  图片里的数字  是下面的序号

1. 1. 1. 　选择器：first-child{属性：值；} 选中的标签 是父级的第一个字标签 则被选中    例子   ：   li：first-child{属性：值；}        如果不是ul的第一个子元素 则不会被选中
      2.    选择器：last-child{属性：值；} 选中的标签 是父级的倒数第一个字标签 则被选中    例子   ：   li：last-child{属性：值；}        如果不是ul的倒数第一个子元素 则不会被选中
      3.    选择器：nth-child(n){属性：值；} 选中的标签 父级的 第n个子元素   例子   li：nth-child(3)     如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中
      4.    选择器：nth-last-child(n){属性：值；} 选中的标签 父级的倒数 第n个子元素   例子   li：nth-last-child(3)  如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中
      5.    选择器：nth-child(odd){属性：值；}  父级开始  子元素  以奇数的形式改变；如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中
      6.    选择器：nth-child(even){属性：值；}  父级开始  子元素  以偶数的形式改变；如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中
      7.    选择器：nth-last-child(odd){属性：值；}  父级倒数开始  子元素  以奇数的形式改变；如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中     **自己猜想没有试过
      8.    选择器：nth-last-child(odd){属性：值；}  父级倒数开始  子元素  以偶数的形式改变；如果被选中的 不是li的话  则不会改变  或者被选中不是 选择器的 则不会被选中     ***自己猜想 没有试过

• • • 目标伪类
    • 空伪类
    • 排除伪类

css 选择器

标签：type   通配   pre   code   alt   inf   序号   ***   属性选择器   

原文地址：https://www.cnblogs.com/pqy521/p/9174123.html