看官方解释
element element 例子: div p 官方解释:div内部所有的p元素
就是说 只要p在div内部。如果 p在span内部，span在div内部，p也算在div内部
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <style> 5 div p 6 { 7 background-color:yellow; 8 } 9 </style> 10 </head> 11 <body> 12 13 <div> 14 <p>段落 1。 在 div 中。</p> <!--黄色背景--> 15 <p>段落 2。 在 div 中。</p> <!--黄色背景--> 16 <span><p>121234</p></span> <!--黄色背景--> 17 </div> 18 19 <p>段落 3。不在 div 中。</p> 20 <p>段落 4。不在 div 中。</p> 21 22 </body> 23 </html>
element > element 例子 div > p ，官方解释: 选择父元素为 <div> 元素的所有 <p> 元素。
p在span内部，span在div内部，p这时的父元素不是div而是span,那么p没有被中，p是div孙子元素
<!DOCTYPE html> <html> <head> <style> div>p { background-color:yellow; } </style> </head> <body> <h1>Welcome to My Homepage</h1> <div> <h2>My name is Donald</h2> <p>I live in Duckburg.</p> <!--黄色--> </div> <div> <span><p>I will not be styled.</p></span> <!--p在span里。但是p的父元素是span，所以这里不是黄色--> </div> <p>My best friend is Mickey.</p> </body> </html>