层次选择器

Posted 2020-12-22 huangui

我们知道页面是由标签组成的，然后页面的标签类似于数据结构的树的结构，然后通过选择某个标签的后台、儿子、弟弟等选择器的方式称为层次选择器。

1.后代选择器

        /*后代选择器*/
        body p{
            background:red;
        }

2.儿子选择器

        /*子选择器*/
        body>p{
            background:green;
        }

3.最大的弟弟选择器

        /*向下相邻兄弟选择器的第一个（只有一个，最大的弟弟选择器）（弟弟选择器）*/
        .active+p{
            background:darkorange;
        }

4.所有弟弟选择器

        /*全部弟弟选择器，*/
        .active~p{
            background:slateblue;
        }