zoukankan      html  css  js  c++  java
  • CSS选择器笔记

    1. 简单选择器

    1.1 标签选择器

    p {color: red}

    1.2 类选择器

    .first {color: red}

    1.3 ID选择器

    #polite {color: red}

    1.4 通用选择器

    * {color: red}

    2. 属性选择器

    2.1 存在和值属性选择器

    [attr] : 该选择器选择包含 attr 属性的所有元素,不论 attr 的值为何
    [attr=val] : 该选择器仅选择 attr 属性为 val 的所有元素(不能还有其他属性)
    [attr~=val] : 该选择器选择 attr 属性中包含 val 的元素

    2.2 子串值属性选择器

    [attr|=val] : 选择 attr 属性的值是 val 或值以 val- 开头的元素
    [attr^=val] : 选择 attr 属性的值以 val 开头的元素(包括 val 值)
    [attr$=val] : 选择 attr 属性的值以 val 结尾的元素
    [attr*=val] : 选择 attr 属性的值中包含子字符串 val 的元素

    3. 伪类和伪元素

    3.1 伪类

    a:hover {color: darkred;}

    3.2 伪元素

    [href^=http]::after {content: '⤴';}

    4. 组合器和多用选择器

    CombinatorsSelect
    A, B 匹配满足A、B的任意元素
    A B 匹配 B 是 A 的后代节点
    A > B 匹配 B 是 A 的直接子节点
    A + B 匹配 B 是 A 的下一个兄弟节点
    A ~ B 匹配 B 是 A 之后的兄弟节点中的任意一个
  • 相关阅读:
    vi常用命令学习
    [Oracle]约束(constraint)
    [Oracle]高水位标记(HWM)
    线性表&顺序线性表
    ERP,ARP瘦身并如何删除。
    Oracle 如何开启归档模式
    oracle9i的erp数据库无法正常关闭的解决方法。
    C语言学习之assert
    ORA-00257 archiver error的处理
    单利与复利
  • 原文地址:https://www.cnblogs.com/zawier/p/9417321.html
Copyright © 2011-2022 走看看