基礎子元素選擇器只能一級一級向下尋找,不能跨越
HTML程式碼:
<p> this is my <strong><i>w</i>eb</strong> page. </p>
CSS程式碼:
p>strong { color: purple; } p>strong>i { font-size: 50px; }
1、與後代選擇器相比,子元素選擇器只能選擇作為某元素子元素的元素。
2、子元素選擇器使用大於號">"做為連接符號。
範例1:
<html> <head> <style type="text/css"> h1 > strong { color: red; } </style> </head> <body> <h1>This is <strong>very</strong> <strong>very</strong> important.</h1> <h1>This is <em>really <strong>very</strong></em> important.</h1> </body> </html>
範例2
##範例2<html> <head> <style type="text/css"> table.company td > p { color: red; } </style> </head> <body> <table class='company'> <tr> <td> <p>hello</p> </td> </tr> </table> <table> <tr> <td> <p>world</p> </td> </tr> </table> </body> </html>