zoukankan      html  css  js  c++  java
  • css——伪类选择器

     

    <body>
        <div class="box">   
    <p>0</p>
            <div>1</div>
            <div>2</div>
            <div>3</div>
            <div>4</div>
            <div>5</div>
            <p>1</p>
        </div>
    </body>

    几个比较有用的伪类选择器:

    选中第一个目标元素:

    .box div:first-of-type{
                
            }#选中第一个div元素。无论div前面有多少个其他元素

    选中最后一个目标元素:

    .box div:last-of-type{
                
            }
    #选中最后一个div元素。无论div前面有多少个其他元素
    
    

    选中前几个目标元素:只需要将n改为负值,使用最后一个目标元素的位置加上   -n  就可以实现。

    例如我们要选中前两个div元素,最后一个div的位置是3,那么就是   

    .box div:nth-child(-n+3){
                font-size: 50px;
            }

     选择某个特定子元素其父类只有此子元素自身:

            div :only-child{# 选中的是div标签下只有一个子元素的此子元素
                font-size: 50px;
            }
          
        </style>
    </head>
    <body>
        <div>1
            <a href="">3</a>
        </div>
        <div>2
            <a href=""></a>
            <a href=""></a>
        </div>
        <div>
            <a href="">3</a>
            
        </div>
        <div>4
            <p>4</p>
        </div>
        <div>5</div>
    </body>

    如果要广泛选择只有一个子元素的标签的子元素,则将分号前面的标签名字去掉即可。


    选择器1:not(选择器2):选择选择器1除选择器2选择的元素之外的元素

  • 相关阅读:
    从B树、B+树、B*树谈到R 树
    从LSM-Tree、COLA-Tree谈到StackOverflow、OSQA
    Linux Kafka源码环境搭建
    CentOS 关闭图形用户界面
    部署与管理ZooKeeper(转)
    spark 2.0.0集群安装与hive on spark配置
    hive on spark的坑
    Spark2.0.0源码编译
    hive spark版本对应关系
    CentOS7 设置集群时间同步
  • 原文地址:https://www.cnblogs.com/baihuatian/p/12021030.html
Copyright © 2011-2022 走看看