div>p 是子类选择器,选择所有div的所有子元素中p元素(不包括孙子类元素)。
div p 是后代选择器,选择所有div中所包含的所有p元素(包括孙子类元素)。
<body>
<div id="header"><div class="red"></div></div>
<div id="content"></div>
<div id="footer"><div class="red"></div></div>
</body>
样式表↓
#header .red{}
#footer .red{}
用#的是ID选择器,命名时用id,在一个页面里不能重复出现。
用.的是类选择器,命名时用class,在一个页面里可以出现多次。
配合最上面那几句代码一起看,那这个样式表的意思就是id名为header的Div里面嵌了一个class名为red的Div
不知道你看得懂不?顺便和你分享一个资料,看下图。