码迷,mamicode.com
首页 > 其他好文 > 详细

伪类选择器

时间:2020-06-14 20:41:29      阅读:75      评论:0      收藏:0      [点我收藏+]

标签:root   enable   其他   option   ted   targe   over   radio   包括   

伪类选择器

伪类选择器前面都有 : (冒号)

  • 除了 hover,其他一般用于链接

    • link —— 对 鼠标点击之前(未被访问)
    • hover —— 对 鼠标指针悬停
    • active —— 对 鼠标点击
    • visited —— 对 鼠标点击之后(已被访问)
    • target —— 可用于选取当前活动的目标元素,有锚名称 #,指向文档内某个具体的元素。这个被链接的元素就是目标元素
  • 普遍

    • root —— 匹配文档根元素,在 HTML 中,根元素始终是 html 元素。
    • focus —— 对 获得焦点
    • checked —— 对 选中的 radio,checkbox,option
    • disabled —— 对 带有 disabled 属性
    • enabled —— 对 不带 disabled 属性
    • empty —— 对 不带任何子元素(包括文本节点)
    • invalid —— 对 非法的表单元素值(例如元素值 min,max 限定,email 格式等)
    • valid —— 对 合法的表单元素值
    • optional —— 对 非必选的表单元素,即没有设置 required 属性的标签为 optional
    • required —— 对 必选的表单元素
  • 位置关系

    • first-child —— 匹配 任意父元素的 第一个子元素,该子元素要是冒号前的元素
    • last-child —— 匹配 任意父元素的 最后一个子元素,同上
    • first-of-type —— 匹配 任意父元素的 第一个 该标签 的孩子
    • last-of-type —— 匹配 任意父元素的 最后一个 该标签 的孩子
  • 位置关系

    • nth-child(n) —— 对 任意元素的第 n 个孩子
    • nth-last-child(n) —— 同上,但是从后往前数的第 n 个
    • nth-of-type(n) —— 对 任意元素的第 n 个 该标签的孩子
    • nth-last-of-type(n) —— 同上,但从后往前数
    • only-child —— 匹配其父元素的 唯一子元素 的每个元素。(只能有 1 个孩子,且就是该标签的)
    • only-of-type —— 匹配其父元素的 特定类型的唯一子元素 的每个元素。(可以有多个孩子,但该标签的只能有 1 个)

伪类选择器

标签:root   enable   其他   option   ted   targe   over   radio   包括   

原文地址:https://www.cnblogs.com/pengnima/p/13126628.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!