1. 程式人生 > >區分子選擇器和後代選擇器

區分子選擇器和後代選擇器

首先為了我們能明顯看到子代選擇器和後代選擇器對樣式的影響,我們定義一個結構

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>後代子代選擇器</title>

    <style>

        div{

            background-color: #ffffff;

        }

        /*  主DIV樣式 */

        .mainDiv{

            height: 200px;

            width: 200px;

            background-color: #ffff00;

            padding: 20px;;

        }

    </style>

</head>

<body>

    <div>

        我是主DIV

        <div>

            兒子

            <div>

                孫子

            </div>

        </div>

    </div>

</body>

</html>

執行結果如圖