欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器

程序员文章站 2024-01-01 19:13:10
高级选择器: 后代选择器 子代选择器 并集选择器 交集选择器 一、后代选择器: 使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子) 也就是说,box类下的所有span标签 字体颜色都被设置为了红色 二、子代选择器: 使用>表示子代选择器. 之选中box类下第一层的span标签设置为红色 ......

  高级选择器:

  • 后代选择器
  • 子代选择器
  • 并集选择器
  • 交集选择器

一、后代选择器:

  使用空格表示后代选择器,父元素的后代(包括儿子,孙子,从孙子)

  也就是说,box类下的所有span标签 字体颜色都被设置为了红色

.box  span{

  color:red;  

}

二、子代选择器:

  使用>表示子代选择器. 之选中box类下第一层的span标签设置为红色

.box>span{
    color:red;
}

三、并集选择器:

  多个选择器之间用逗号隔开,表示选中页面中的多个标签,  一些共性的元素可以使用并集选择器

  所有的div和a中的字体同时被设置成了红色,

div,a{
  color:red;  
}

四、交集选择器:

  使用交集选择器,第一项必须是标签选择器,第二项必须是类选择器 比如:

  在所有div中选中类名为active的div并设置背景颜色为红色.

div.active{
     background-color:red;      
}

 

上一篇:

下一篇: