選擇器

上下文選擇器

上下文選擇器

1. 父子選擇器（標(biāo)識(shí)符“>”,僅限父子使用）
   代碼演示：

    <ul class="demo" style="border: 1;">
        <li class="itme1">紅色</li>
        <li class="itme2">藍(lán)色</li>
        <li class="itme3">綠色</li>
        <li class="itme4">粉色</li>
        <li class="itme5">中國(guó)
             <ul>
                <li class="itme">北京</li>
                <li class="itme">上海</li>
                <li class="itme">河南</li>
                <li class="itme">廣州</li>
             </ul>
            </li>
        <li class="itme6">美國(guó)</li>
        <li class="itme7">韓國(guó)</li>
    </ul>
    <style>
     1.<!-- 父子選擇器 標(biāo)識(shí)符:">"" -->
        .demo > .itme5{
            color: red;
        }
        2.<!-- 后代選擇器 標(biāo)識(shí)符:"空格"" -->
        .demo .itme5 .itme{
        border: 1px solid hsl(297, 90%, 44%);
    }
    3. <!-- 兄弟選擇器 標(biāo)識(shí)符:"+"" -->
    .demo>.itme5+.itme6{
        background-color: lightgreen;
    }
    4.<!-- 兄弟選擇器 標(biāo)識(shí)符:"~ *" -->
    .demo>.itme5 ~ *{
        background-color: #b40c68;
    }
    </style>

批改老師：PHPz

批改狀態(tài)：合格

老師批語(yǔ)：沒(méi)什么問(wèn)題，繼續(xù)加油