关于伪类选择器，伪元素选择器 后代选择器的一些笔记

后代选择器为  （空格）

.eee li  选中类名为eee下的所有li后代。

子代选择器为>

.eee>li 选中类名为eee下的所有li子代

下一个兄弟 ul>li.two+li  :选中ul标签下类名为two的li标签下一个人li标签

                      ul>li.two+* 选中ul标签下类名为two的li标签下一个标签

之后所有兄弟  ul>li.two ~li 选中ul标签下类名为two的li标签后面所有li兄弟标签

                       ul>li.two~* 选中ul标签下类名为two的li标签后面所有兄弟标签

属性选择器

input[type="text"]  选中input标签中type="text"的input标签

 input[type^=s]  选中input标签中type=“类型” 类型首字母为s
 input[type$=t] 选中input标签中type=“类型” 类型末尾字母为t
 input[type*=t] 选中input标签中type=“类型” 类型包含字母t

伪类选择器

表示结构的
    a.同级别的
    p:first-child: 选中同级别第一个元素
    p:last-child: 选中同级别最后一个元素
    p:only-child: 匹配属于父元素中唯一子元素的 p 元素
    p:nth-child(n): 同级别中第n个子元素
    p:nth-child(odd): 同级别中所有的奇数标签
    p:nth-child(even): 同级别中所有的偶数标签
  b.同类型（防止同级别中类型不同而难以选择）
    p:first-of-type：同级别中同类型的第一个标签
    p:last-of-type：同级别中同类型的最后一个标签
    p:nth-of-type(n)：同级别中同类型的第n个标签
            表示状态的
              a  :link 未打开的链接
              a  :hover  鼠标悬浮
               a :active 正被激活的链接
               a :visited 已访问都链接
              a  :focus 鼠标选中

伪元素选择器：

::before{}
在元素所有内容之前

::after{}在元素所有内容之后

：：first-letter{}

选中第一个字符

：：first-line{}

选中第一行的内容

input::sekector{}

选中被选择的内容

    选择器优先级

1.!important
2.若选择器权重相同，则就近
3.行内：1000
  id选择器: 100
  类选择器，属性选择器，伪类选择器：10
  标签选择器，伪元素选择器：1

 

转载于:https://www.cnblogs.com/bhba223/p/11278856.html