zoukankan      html  css  js  c++  java
  • 兄弟选择器 + 和 ~

     1 <!DOCTYPE html>
     2 <html lang="en">
     3 <head>
     4     <meta charset="UTF-8">
     5     <title>div+div</title>
     6     <style>
     7         /*只选择 li 下的div的相邻兄弟节点 */
     8         li div+div {
     9             background-color: red;
    10         }
    11 
    12         /*选择div 下的 所有p标签*/
    13         div~p{
    14             background-color: pink;
    15         }
    16     </style>
    17 </head>
    18 <body>
    19     <ul>
    20         <li>
    21             <div>1</div>
    22             <p>1</p>
    23             <div>2</div>
    24             <div>3</div>
    25         </li>
    26     </ul>
    27     
    28     <div>1</div>
    29     <p>2</p>
    30     <span>3</span>
    31     <p>4</p>
    32 
    33 </body>
    34 </html>

    没什么好讲的,写一遍意会一下 就知道了

  • 相关阅读:

    list集合
    接口
    抽取对象的基本方法
    访问修饰符
    构造方法
    如何弹出一个对话框
    nginx反代配置
    TreeMap排序
    BeanPropertyRowMapper
  • 原文地址:https://www.cnblogs.com/yang-C-J/p/6366247.html
Copyright © 2011-2022 走看看