伪类&伪元素

伪类

1.目标伪类: 主要应用于锚点

:target(选中的锚点添加状态p:target是交集选择器)

2.目标状态伪类

:disabled, :enabled, :checked

3.动态伪类: 有顺序要求

a:link(未访问), a:visited(已访问), a:focus(tabindex属性=-1来去掉tab), a:hover(移动放上去), a:active(手指点下去)

4.结构伪类

• :nth-child(n), n是正整数(包括0).排行榜可以用-n+3来设置前三名
• :nth-last-child(n), 倒着数
• p:nth-of-type(n) 只找p的n数
• p:nth-last-of-type(n) 倒着
• :only-child (唯一子元素)
• :only-of-type(唯一类型子元素)
• :root(相当于html元素)
• :empty
• :not()

伪元素(区别伪类一般2个冒号,可以看成行内元素)

1. p::first-letter
2. p::first-line
3. ::before(利用content来在元素前添加东西(可以是url()))

   span::before{
     content: "123";
     color: #0f0;
   }

4. ::after(利用content来在元素后添加东西(可以是url()))

   span::before{
     content: "123";
     color: #0f0;
   }