| 후손 선택자 | |
| 선택자 A 선택자 B | 선택자A의 후손에 위치하는 선택자 B를 선택 |
| <style> #header h1 { color: red; } </style> <body> <div id="header"> <h1>Test</h1> </div> </body> |
|
| 자손 선택자 | |
| 선택자 A > 선택자 B | 선택자A의 자손에 위치하는 선택자 B를 선택 |
| <style> #header > h1 { color: blue; } </style> <body> <div id="header"> <h1>Test</h1> </div> </body> |
|
table 태그의 요소를 선택할 때는 자손 선택자의 주의가 필요하다
table 태그에 tbody가 자동으로 추가됨으로 스타일 적용이 안될수 있다.(경로 사이에 tbody가 추가 됨으로)