CSS复合选择器


一、为什么学习CSS复合选择器?

    CSS选择器分为基础选择器与复合选择器,但实际选择器不能满足实际开发,快速高效选择标签

     1.目的是为了可以选择更为精确的目标与标签

     2.复合选择器由两个或多个基础选择器,通过不同方式组合而成

二、后代选择器(重点)

   又称包含选择器

    作用:用来选择元素或元素子孙后代    

     其写法就是,把外层标签写在前面,内层标签写在后面,中间空格分隔,先写父亲爷爷,在写孙子

           父级  子级{ 属性:属性值;属性:属性值;}

    语法:  .class h3 { color:red; font-size:12px;}

 

 

 

三、子元素选择器

   作用:子元素选择器只能选择作为某元素子元素(亲儿子)的元素

    其写法就是把父级标签写在前面,子级标签写在后边,中间跟一个>进行连接

  语法:.class>h3 { color :red; font-size:14px; }      

    注意:这里的子儿子指亲儿子  不包含孙子 重孙子之类

 

 

  比如·:.demo>h3 { color:red; }   说明   h3  一定是demo  亲儿子  demo 元素包含着h3

 

四、交集选择器

    条件:交集选择器由两个选择器构成,找到的标签必须满足:既有标签一的特点,也有哦标签二的特点

 

    比如:p.one  选择的是:类名为.one  的  段落标签      用的来说相对较少,不太建议使用

五、并集选择器(重点)

   应用:若某些选择器定义的样式完全相同,或部分相同,就可以利用并收集选择器为它们定义相同CSS样式

      并集选择器(CSS选择器分组)是各个选择器通过,连接而成的

 

 

 

六、链接伪类选择器(重点)

 其与类选择器相区别,类选择器是一个点 比如:.demo{}  而伪类  用2个点   就是冒号  比如:link{}  伪娘

  作用:用于向某些选择器添加特殊效果,比如给链接添加效果,比如可以选择第一个,第n个元素    因为伪类选择器更多,比如链接伪类,结构伪类等。

 

 

七、复合选择器总结

 

 

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM