首页 > 代码库 > 8_选择器

8_选择器

一、
css selector (选择器,选择符)
     1. id selector 通过查找具有某个id属性的元素来添加样式
        id = "idName"

    #idName {
        样式……
    }

    *注意:同一个页面中id不能重名
      2. tag selector(类型选择器,标签选择器,元素选择器) 通过标签的名字找到某一类型标签添加样式
  

 tagName {
        样式……
    }    


      3. class selector(类选择器) 通过查找具有某类class属性的元素来添加样式
   

class = "className"
    .className {
    }


    *注意: 1) class可以重复调用
            2) 元素可以具有多个className,每个名字中间以空格隔开,每个名字添加的样式,元素都会识别

   4.* 通配符 (通配选择器),代表所有的元素 (不推荐使用)


   5.包含选择器 (后代选择器)
    如:

a:hover span {
        color: yellow;
}

#box span {
}

找到box中包含的span标签

    1. 层级数目不要过多 一般不超过三层

    2. 子级是id话,一般不用包含选择器

    3. 包含选择器的优先级是其中用到的所有选择器的累加


二、
  元素可以同时使用多种选择器,每种选择器添加的样式,元素都会识别
        当我们在不同的选择器中,添加了同一条样式,这种情况下,元素最终显示
        那个选择器下的样式,我们就叫做这个选择器的优先级高
  选择器优先级一致的情况下,后边的覆盖前边的   
      id选择器的优先级高于class
      class选择器的优先级高于tag选择器
      tag选择器的优先级高于*
      style 行间样式优先级最高

      style > id > class > tag > *


三、inherit 继承
    父级的这条样式是怎样的元素的这条样式就是怎样的
    文本样式,自己没有设置这条样式,就会继承父级,如果子元素设置就显示子元素自己的样式
    文本样式,子极会继承父级


 

 

一、

css selector (选择器,选择符)

1. id selector 通过查找具有某个id属性的元素来添加样式

id = "idName"

#idName {

样式……

}

** 同一个页面中id不能重名

2. tag selector(类型选择器,标签选择器,元素选择器) 通过标签的名字找到某一类型标签添加样式

tagName {

样式……

}

3. class selector(类选择器) 通过查找具有某类class属性的元素来添加样式

class = "className"

.className {

}

 

 

** 1) class可以重复调用

   2 元素可以具有多个className,每个名字中间以空格隔开,每个名字添加的样式,元素都会识别

 

4. * 通配符 (通配选择器),代表所有的元素 (不推荐使用)

 

 

 

二、

元素可以同时使用多种选择器,每种选择器添加的样式,元素都会识别

    当我们在不同的选择器中,添加了同一条样式,这种情况下,元素最终显示

那个选择器下的样式,我们就叫做这个选择器的优先级高

 

id选择器的优先级高于class

class选择器的优先级高于tag选择器

tag选择器的优先级高于*

style 行间样式优先级最高

 

style > id > class > tag > *

 

 

 

 

三、

 

inherit 继承

父级的这条样式是怎样的元素的这条样式就是怎样的

文本样式,自己没有设置这条样式,就会继承父级,如果子元素设置就显示子元素自己的样式

文本样式,子极会继承父级

inherit 继承 父级的这条样式是怎样的元素的这条样式就是怎样的

选择器优先级一致的情况下,后边的覆盖前边的

 

 

8_选择器