Parent-child selectors
¢¸ ¢º

Parent-child selector´Â ÇϳªÀÇ element°¡ ´Ù¸¥ element¿¡ Æ÷ÇԵǾúÀ» ¶§ ½ºÅ¸ÀÏÀ» Á¤ÀÇÇϵµ·Ï ÇØÁØ´Ù. Contextual selector¿Í ºñ½ÁÇѵ¥, contextual selector°¡ 2´ë³ª 3´ë ÀÚ¼ÕÀÌ µÇ¾îµµ µÇ´Â ¹Ý¸é, parent-child selector´Â À̸§¿¡ ³ªÅ¸³ªµíÀÌ Æ÷ÇԵǴ ù¹ø° element¿¡¸¸ ÇØ´çµÈ´Ù.
Parent-child selector¸¦ ³ªÅ¸³¾ ¶§´Â ~ Ç¥½Ã¸¦ ÇØ ÁØ´Ù.
BODY { font-size : 10pt ; line-height : 12pt}
BODY ~ P { line-height: 16pt } /*BODY¿¡ 1Â÷·Î Æ÷ÇԵǴ P¿¡ Àû¿ë*/
...
...
<BODY>
<P>
¿©±â´Â ÁÙ °£°ÝÀÌ 16ptÀÌ´Ù.<BR>
¿©±â´Â ÁÙ °£°ÝÀÌ 16ptÀÌ´Ù.
</P>
<BLOCKQUOTE>
¿©±â´Â ÁÙ °£°ÝÀÌ 12ptÀÌ´Ù.<BR>
¿©±â´Â ÁÙ °£°ÝÀÌ 12ptÀÌ´Ù.
<P>
¿©±âµµ ÁÙ °£°ÝÀÌ 12ptÀÌ´Ù.<BR>
¿©±âµµ ÁÙ °£°ÝÀÌ 12ptÀÌ´Ù.
</P>
</BLOCKQUOTE>
ÀÌ·¸°Ô ³ª¿Í¿ä
¾ÆÁ÷Àº ¿Ïº®ÇÏ°Ô ±¸ÇöµÇÁö ¾Ê´Â °Í °°´Ù. ¿¹¸¦ º¸¸é ¾Ë°ÚÁö¸¸ BLOCKQUOTEÀÇ ÀÚ½ÄÀÎ P(BODYÀÇ ¼ÕÀÚ)¿¡µµ BODY ~ P¿¡ Á¤ÀÇÇÑ ½ºÅ¸ÀÏÀÌ ±×´ë·Î Àû¿ëµÇ°í ÀÖ´Ù.

¢¸ ¢º