css>尖括号+加号 CSS大于号等用法

css一些特殊的选择器使用方法:
加号 选择临近紧贴后面的一个元素

  <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
 
    <style>
        .abc + li {
            color: red;
        }
    </style>
</head>
<body>
 
<div class="abc"></div>
<div >d</div>
</body>
</html>

 

>号,缩小选择元素的范围

 

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

 

    <style>

   h1 > strong {color:red;}

    </style>

</head>

<body>

子元素选择器,只执行一次子元素,

<h1>This is <strong>very</strong> <strong>very</strong> important.</h1>

<h1>This is <em>really <strong>very</strong></em> important.</h1>

这个规则会把第一个 h1 下面的两个 strong 元素变为红色,但是第二个 h1 中的 strong 不受影响:

 

</body>

 

</html>