CSS高级复杂选择器

作者: 不住海边也喜欢浪 | 来源:发表于2016-10-21 17:31 被阅读146次

    兄弟选择器

    • 相邻兄弟选择器
      • 下一个紧挨着的元素,
      • 相邻元素的父元素要相同
      • 可以通过连加找到兄弟的兄弟元素
      • 链接符是 +
    • 通用兄弟选择器
      • 后面的所有指定元素
      • 两种元素必须拥有相同的父元素
      • 通过 ~链接

    属性选择器

    能够将元素附带的属性用于选择器中,从而对带有指定属性的元素设置样式
    如 [title]:选择所有写了title的值,不管属性值是什么

    伪类选择器

    • 目标伪类
      • :target 匹配设置锚点并处于活动状态的元素
    • 元素状态伪类
      • :enabled 匹配每个已启用的元素(大多数用在表单元素上)
      • :disabled 匹配每个被禁用的元素(大多数用在表单元素上)
      • :checked 匹配每个已被选中的input元素(只用于单选按钮和复选框)
    • 结构伪类
      • :first-child 匹配属于其父元素的首个子元素
      • :last-child 匹配属于父元素的最后一个子元素
      • :empty 匹配没有子元素(包括文本节点)的每个元素
      • :only-child 匹配属于其父元素的唯一子元素
      • :nth-child(n) 匹配父元素中第n个指定元素
    • 否定伪类
      • :not(selector) 匹配非指定元素/选择器的每个元素

    伪元素选择器

    • first-letter用于选取指定选择器的首字母
      常用语排版细节,如首字母突出显示,下沉等
    • first-line用于选取指定选择器的首行
    • :selection用于匹配被用户选取的部分

    相关文章

      网友评论

        本文标题:CSS高级复杂选择器

        本文链接:https://www.haomeiwen.com/subject/dprcuttx.html