• CSS3 选择器用法小结


    表单选择器:

    /*:enabled 可用的 :disabled 被禁用的 :focus 获取了焦点的 
    多用在表单元素上*/
    input:enabled {...}
    input:disabled {...}
    input:focus {...}

    属性选择器:

    /*[attribute] [attribute=value] 选择具有对应属性的元素
    即使此属性没有实际作用*/
    a[target] {...}
    a[target=_blank] {...}

    次序选择器:

    :first-child 选取属于其父元素的首个子元素
    :last-child 选取属于其父元素的最后一个子元素
    :nth-child(n) 选取父元素的第n个子元素
    :nth-last-child(n) 倒序选取父元素的第n个子元素

    /*计算次序时不考虑类型,但如果符合次序的元素跟选择器的类型不匹配,则不会被选取*/
    ul li:first-child {...}
    p:nth-child(odd) {...}
    p:nth-child(even) {...}
    p:nth-last-child(2) {...}
    

    :first-of-type 父元素的特定类型的首个子元素的每个元素
    :last-of-type 父元素的特定类型的首个子元素的每个元素
    :nth-of-type(n) 父元素的特定类型的第n个子元素
    :nth-last-of-type(n) 父元素的特定类型的第n个子元素的每个元素,从最后一个子元素开始计数

    /*只对类型匹配的元素进行次序计算*/
    ul li:first-of-type {...}
    p:last-of-type {...}
    p:nth-of-type(2) {...}
    
  • 相关阅读:
    【应试】数据通信与网络
    【应试】操作系统OS
    【笔记】 卷积
    【HDU 5920】 Ugly Problem
    【笔记】位运算
    【洛谷P1378】油滴扩展
    【洛谷 P1120】 小木棍[数据加强版]
    [codeforces]Round #538 (Div. 2) F. Please, another Queries on Array?
    [BZOJ]2563: 阿狸和桃子的游戏
    [BZOJ]4668: 冷战
  • 原文地址:https://www.cnblogs.com/yangshifu/p/9277396.html
Copyright © 2020-2023  润新知