伪类和伪元素

给链接定义样式
  • 有四个伪类可以让你根据访问者与该链接的交
     互方式,将链接设置成4种不同的状态。
  • 正常链接   – a:link
  • 访问过的链接– a:visited(只能定义字体颜色)
  • 鼠标滑过的链接– a:hover
  • 正在点击的链接– a:active
其他
  • 获取焦点– :focus
  • 指定元素前– :before
  • 指定元素后– :after
  • 选中的元素– ::selection
所有的伪类和伪元素
  1:checked   input:checked 选择所有选中的表单元素
  2:disabled   input:disabled 选择所有禁用的表单元素

  3:empty    p:empty 选择所有没有子元素的p元素

  4:enabled   input:enabled 选择所有启用的表单元素

  5:first-of-type   p:first-of-type 选择每个父元素是p元素的第一个p子元素

  6:in-range   input:in-range 选择元素指定范围内的值

  7:invalid   input:invalid 选择所有无效的元素

  8:last-child   p:last-child 选择所有p元素的最后一个子元素

  9:last-of-type   p:last-of-type 选择每个p元素是其母元素的最后一个p元素

  10:not(selector)   :not(p) 选择所有p以外的元素

  11:nth-child(n)   p:nth-child(2) 选择所有p元素的第二个子元素

  12:nth-last-child(n)   p:nth-last-child(2) 选择所有p元素倒数的第二个子元素

  13:nth-last-of-type(n)   p:nth-last-of-type(2) 选择所有p元素倒数的第二个为p的子元素

  14:nth-of-type(n)   p:nth-of-type(2) 选择所有p元素第二个为p的子元素

  15:only-of-type   p:only-of-type 选择所有仅有一个子元素为p的元素

  16:only-child   p:only-child 选择所有仅有一个子元素的p元素

  17:optional   input:optional 选择没有"required"的元素属性

  18:out-of-range   input:out-of-range 选择指定范围以外的值的元素属性

  19:read-only   input:read-only 选择只读属性的元素属性

  20:read-write   input:read-write 选择没有只读属性的元素属性

  21:required   input:required 选择有"required"属性指定的元素属性

  22:root   root 选择文档的根元素

  23:target   #news:target 选择当前活动#news元素(点击URL包含锚的名字)

  24:valid   input:valid 选择所有有效值的属性

  25:link   a:link 选择所有未访问链接

  26:visited   a:visited 选择所有访问过的链接

  27:active   a:active 选择正在活动链接

  28:hover   a:hover 把鼠标放在链接上的状态

  29:focus   input:focus 选择元素输入后具有焦点

  30:first-letter   p:first-letter 选择每个<p> 元素的第一个字母

  31:first-line   p:first-line 选择每个<p> 元素的第一行

  32:first-child   p:first-child 选择器匹配属于任意元素的第一个子元素的 <p> 元素

  33:before   p:before 在每个<p>元素之前插入内容

  34:after   p:after 在每个<p>元素之后插入内容

  35:lang(language)   p:lang(it) <p>元素的lang属性选择一个开始值

原文地址:https://www.cnblogs.com/zqy6666/p/11785463.html