CSS 요소 선택기는 요소 이름이 두 번째 선택기와 일치하는 첫 번째 요소의 자손을 선택하는 데 사용됩니다.
구문
CSS 자손 선택자의 구문은 다음과 같습니다 -
element element { /*declarations*/ }
예시
다음 예는 CSS 자손 선택자를 보여줍니다 -
<!DOCTYPE html> <html> <head> <style> div { float: right; margin: 25px; padding: 5px; width: 80px; height: 80px; border: solid aqua; } div div { border-color: blue; border-radius: 50%; } div div div { border-color: orange; border-radius: unset; } </style> </head> <body> <div> <div> <div> </div> </div> </div> </body> </html>
출력
이것은 다음 출력을 제공합니다 -
예시
<!DOCTYPE html> <html> <head> <style> li li { background-color: lightsteelblue; } </style> </head> <body> <ol> <li></li> <ul> <li> <ul> <li></li> </ul> </li> </ul> <li></li> </ol> </body> </html>
출력
이것은 다음 출력을 제공합니다 -