»ç¿ëÀÚ°¡ ¸¶¿ì½º¸¦ ¿¬°á¿¡ ¿Ã·Á³ùÀ» ¶§ Àû¿ëµÉ a ¿¤·¹¸àÆ®ÀÇ ½ºÅ¸ÀÏÀ» ¼³Á¤ÇÑ´Ù.
¿¬°á À§¿¡ ¸¶¿ì½º¸¦ ¿Ã¸®°í Ŭ¸¯ÇÏÁö ¾Ò¾ÒÀ» ¶§ ¿¬°á¿¡ Àû¿ëµÇ´Â ½ºÅ¸ÀÏÀÌ´Ù. Ŭ¸¯ÇÏ¿´À» ¶§´Â :active °¡»ó Ŭ¶ó½º°¡ Àû¿ëµÈ´Ù.
ÀϹÝÀûÀ¸·Î :hover °¡»ó Ŭ¶ó½º(pseudo-class)´Â ¿¬°á¿¡ ÀÛ¿ëÇÏ´Â ´Ù¸¥ °¡»ó Ŭ¶ó½º :active, :link¿Í :visited¿Í ÇÔ²² »ç¿ëÇÑ´Ù.
ÀÌ :hover °¡»ó Ŭ¶ó½º(pseudo-class)ÀÇ µðÆúÆ®°ªÀº ºê¶ó¿ìÀú¿¡ µû¶ó ´Ù¸£´Ù.
°³Ã¼ | script | CSS | IE ¹öÀü |
---|
ÀÌ °¡»ó Ŭ¶ó½º´Â CSS2(Cascading Style Sheets, Level 2)¿¡¼ Á¤ÀǵǾú´Ù.
¿¬°á À§¿¡ ¸¶¿ì½º¸¦ ¿Ã·Áº¸¶ó. °¡»ó Ŭ¶ó½º :hover·Î font-weight¿Í color ¾ÖÆ®¸®ºäÆ®¸¦ ¼³Á¤ÇÑ´Ù.
<STYLE>A:hover { font-weight:bold; color:red;background-color:aqua}</STYLE> <A href="../style/color.html" onclick="return false">¸¶¿ì½º¿Ã¸² ¿¬°á °¡»ó Ŭ¶ó½º</A>
´ÙÀ½ µÎ°¡Áö´Â °°ÀÌ Àû¿ëµÈ´Ù
<STYLE>:hover { font-weight:bold; color:red;background-color:aqua}</STYLE> <STYLE>A:hover { font-weight:bold; color:red;background-color:aqua}</STYLE>