코드:
결과보기 »
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <title>CSS Structural Selectors</title> <style> div{ border: 3px solid #008000; } p:only-child { color: red; font-weight: bold; } </style> </head> <body> <h1>:only-child를 이용한 선택</h1> <div> <p>이 p 태그는 div 태그의 유일한 child 입니다!</p> </div> <div> <p>이 p 태그는 div 태그의 첫 번째 child 입니다!</p> <p>이 p 태그는 div 태그의 두 번째 child 입니다!</p> </div> <div> <p>이 p 태그는 div 태그의 첫 번째 child 입니다!</p> <p>이 p 태그는 div 태그의 두 번째 child 입니다!</p> <p>이 p 태그는 div 태그의 세 번째 child 입니다!</p> </div> <div> <p>이 p 태그는 div 태그의 유일한 child 입니다!</p> </div> </body> </html>