初識CSS-子代選擇符

我們上次學習了後代選擇符,如圖:

<style>
    body h2{
        color:red;
}
</style>

<body>
    <h2>asd</h2>
    <div>
        <h2>qwe</h2>
        <p>asd</p>
    </div>
   
</body>

這樣的話當前頁面下的所有h2標籤中的內容都會變成紅色,

但是我們如果不想讓全部h2變成紅色,我們就可以使用子代選擇符

子代選擇符僅選擇直接子元素,語法:body>h2

<style>
        body>h2{
            color: red;
        }
    </style>

這樣,只有第一個h2元素變成了紅色,div中的h2元素保持不變

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章