zoukankan      html  css  js  c++  java
  • CSS3学习笔记之选择器

    新增的关系选择器有:

    1.亲儿子选择器:>

    2.下一个兄弟:+

    3.下一群兄弟:~

    新增的属性选择器:

    1.标签[^="a"]  : 匹配属性值以a开头的元素

    2.标签[$="a"]:   匹配属性值以a结尾的元素

    3.标签[*="a"]:   匹配属性值含有a的元素

    4.标签[|="a"]:   匹配属性值以a开头,紧跟一个-的元素

    5.标签[~="a"]:  匹配属性值是一个独立的用空格分开的个体

    序号选择器: 序号从1开始。

    1. a:first-child : 匹配是某元素第一个儿子的a标签;

    2. a:last-child: 匹配是某元素最后一个儿子的a标签;

    3. a: nth-child(n): 匹配是某元素第n个儿子的a标签;

       支持表达式,如: a:nth-child(5n+1): 匹配是某元素第1,6,11,16...个儿子的a元素

    4.a:nth-last-child(n): 匹配是某个元素倒数第n个儿子的a元素,同样支持表达式。

     5.  .c:nth-of-type(n): 匹配是某一个元素class为c的儿子中的第n个。

      同理还有 first-of-type/last-of-type

    6.  .c:nth-last-of-type(n): 匹配某一个元素中class为c的儿子中的第n个。

  • 相关阅读:
    oracle-sql脚本
    vue生命周期
    使用vue搭建项目(创建手脚架)
    bootcss
    miniMobile(手机)
    mui(手机)
    layui
    Element
    如何学好Spring
    使用Vue做评论+localStorage存储(js模块化)
  • 原文地址:https://www.cnblogs.com/qingxiawu/p/8506279.html
Copyright © 2011-2022 走看看