CSS(Cascading Style Sheet)¶õ ¹«¾ùÀΰ¡ ?
ÀÎÅÍ³Ý ¹®¼ÀÇ °¡Àå ÀϹÝÀûÀÎ Çü½ÄÀº HTMLÀÌÁö ¸¸, ¹®¼¸¦ ÀÚÀ¯·Ó°Ô ÆíÁýÇÏ´Â µ¥¿¡ ¸¹Àº Á¦¾àÀÌ µû¸¥´Ù.
À̸¦ º¸¿ÏÇϱâ À§ÇØ ¸¸µé¾î Áø °ÍÀÌ ½ºÅ¸ÀÏ ½ÃÆ®´Ù.
½ºÅ¸ÀÏ ½ÃÆ®ÀÇ ¹®¹ý°ú Çü½ÄÀº ¿µ¹® W3C ÀÇ Ä«½ºÄÉÀ̵ù ½ºÅ¸ÀϽ¬Æ®(Cascading Style Sheet) ±Ô°Ý ¹ø¿ª¹® CSS1(¿ø¹® CSS1)°ú ¹ø¿ª¹® CSS2(¿ø¹® CSS2)·Î Ç¥ÁØȵǾî ÀÖ´Ù.
³Ý½ºÄÉÀÌÇÁÀÇ Ä¿¹Â´ÏÄÉÀÌÅÍ ver 4.0, ¸¶ÀÌÅ©·Î¼ÒÇÁÆ®ÀÇ ÀͽºÇ÷η¯ ver 3.xÆÇ¿¡¼ºÎÅÍ CSS1À» Áö¿øÇÔÀ¸·Î½á ¹®¼ Á¦ÀÛ¿¡¼ CSSÀÇ ÀÚÀ¯·Î¿î »ç¿ëÀÌ °¡´ÉÇÏ°Ô µÇ¾ú´Ù.
±×·¯³ª, ÀÌ ¾ç ´ë ºê¶ó¿ìÀú°¡ CSS»Ó ¾Æ´Ï¶ó HTML¿¡¼µµ Ç¥ÁØ ¾ÈÀ» ÀüÀûÀ¸·Î µû¸£°í ÀÖÁö ¾Ê±â ¶§¹®¿¡ ÀÏ¹Ý Á¦ÀÛÀÚµéÀÌ ¹®¼¸¦ ¸¸µå´Â µ¥¿¡ ¾î·Á¿ò°ú È¥¶õÀ» ¾È°Ü ÁÖ°í ÀÖ´Ù.
ÇöÀç Á¦¾ÈµÇ¾î ÀÖ´Â ¿µ¹® CSS2´Â ¾ç ´ë ºê¶ó¿ìÀú°¡ Àç´ë·Î Áö¿øÇÏÁö ¾Ê¾Æ, ¿©±â¿¡¼´Â ExplorerÀ» ±âÁØÀ¸·Î ÇÏ¿© CSS1¸¦ Áß½ÉÀ¸·Î ¼Ò°³ÇÏ¿´°í ÀϺΠCSS2µµ »ç¿ëÇÏ¿´´Ù.
ÀÌ°÷¿¡¼´Â
- Á¦¾È µÈ CSS¿Í ¾ç´ë ºê¶ó¿ìÀú°¡ Áö¿øÇÏ´Â CSSÀÇ ³»¿ë°ú Çü½ÄµéÀ» ¾Ë¾Æº¸°í
- ºê¶ó¿ìÀú¿Í °ü°è¾øÀÌ »ç¿ëµÇ´Â ¹®¼¸¦ ÀÛ¼ºÇÏ´Â ¹æ¹ýÀ» ¾Ë¾Æº¸°í
- CSSÀÇ ´Ù¾ç ÇÑ È°¿ë ¹æ¹ýÀ» °øºÎÇÏ¿© È¿°úÀûÀÎ µðÀÚÀÎÀ» ÇÒ ¼ö ÀÖµµ·Ï µµ¿òÀ» ÁÖ±â À§ÇÏ¿©
ÀÚ¼¼ÇÏ°Ô ¼³¸íÀ» ¼ö·ÏÇÑ´Ù.
CSS(Cascading Style Sheet) ÀÇ ÀåÁ¡
- ±â´É È®À强</span>: HTML ÀÇ ±â´ÉÀ» È®ÀåÇÑ´Ù.
HTMLÀÇ ´ëºÎºÐÀÇ ¿ä¼ÒµéÀÇ ´Ü¼øÇÑ ±â´É¿¡ ´Ù¾çÇÑ ±â´ÉÀ» Ãß°¡ÇÒ ¼ö ÀÖÀ¸¸ç, ½ÉÁö¾î´Â ±â´ÉÀÇ º¯°æ±îÁö °¡´ÉÇÏ´Ù. ÀÌ·¸°Ô ÇÔÀ¸·Î½á ¹®¼Á¦ÀÛÀÚ´Â µ¶Æ¯ ÇÑ ¹®¼Çü½ÄÀ» ¼³°è ÇÒ ¼ö ÀÖ´Ù.
¶Ç ÇÑ HTML¿¡¼ Áö¿øÇÏÁö ¾Ê´Â ´Ù¾ç ÇÑ ÆùÆ® »çÀÌÁî µîÀÇ ±â´Éµµ »ç¿ë ÇÒ ¼ö ÀÖ°Ô µÈ´Ù.
- ¾ç½ÄÀÇ ¸ðµâÈ: È帧ÀÌ °°Àº ¹®¼¾ç½ÄÀ¸·Î Àüü¸¦ ±¸¼º ÇÒ ¼ö ÀÖ´Ù.
HTML¿¡¼´Â ¹®¼ÀÇ Àü¹ÝÀûÀΠƲ¿¡¼ºÎÅÍ ¼¼ºÎ Ç׸ñ±îÁö ¸Þ¹ø ÀÏÀÏÀÌ ÁöÁ¤ ÇØ ÁÖ¾î¾ß ¸¸ ÇÑ´Ù.
±×·¯³ª ½ºÅ¸ÀÏ ½ÃÆ®¸¦ HTML¿¡ ºÎ°¡ÀûÀ¸·Î È°¿ë ÇÔÀ¸·Î½á ÀÏÁ¤ ÇÑ ¾ç½ÄÀ» CSS·Î ÀÛ¼ºÇØ ³õ°í »ç¿ë ÇÒ ¶§ ºÎ¸£±â ¸¸ ÇÏ¸é °°Àº ¾ç½ÄÀ¸·Î Ç¥Çö µÈ´Ù
¶Ç ÇÑ CSS¸¦ º¯°æ ÇÔÀ¸·Î½á ¸ðµç °ü·Ã ¹®¼µéÀÇ Ç¥Çö Çü½ÄÀÌ µ¿½Ã¿¡ º¯°æ µÈ´Ù.
- °£Æí¼º: ¹®¼ÀÇ Çü½ÄÀ» ¼Õ ½±°Ô ´Ù¾çÇÏ°Ô ±¸¼ºÇÒ ¼ö ÀÖ´Ù.
HTML·Î º¹Àâ ÇÑ Ç¥¸¦ ¸¸µå´Â µ¥¿¡ »ó´ç ÇÑ ³ë·ÂÀ» ÇÊ¿ä·Î ÇÑ´Ù. ½ºÅ¸ÀÏ ½ÃÆ®¿¡´Â À̸¦ ±Øº¹ÇÒ ¼ö ÀÖ´Â ´Ù¾çÇÑ ¹æ¹ýÀÌ ÀÖ´Ù. ¹®¼ÀÇ ÀϺθ¦ Á¦ÀÛÀÚ°¡ ¿øÇÏ´Â À§Ä¡¿¡ ºñ±³Àû ÀÚÀ¯·Ó°Ô ¹èÄ¡ ÇÒ ¼ö ÀÖ´Ù.
¶Ç ÇÑ ¹®¹ýÀÌ ¾ÆÁÖ ½¬¿ö ¿ø¸¸ ÇÑ Á¦ÀÛÀÚ´Â ½±°Ô ÀÍÈú ¼ö ÀÖ´Â ÀÕÁ¡ÀÌ ÀÖ´Ù.
- ÀÏ°ü¼º: »ç¿ë ȯ°æÀÇ ¿µÇâÀ» ¹ÞÁö ¾Ê´Â´Ù.
HTML¿¡¼´Â °°Àº ¹®¼¶óµµ »óȲ¿¡ µû¶óÀÚµ¿ Á¶Àý ±â´É¿¡ ÀÇ ÇØ Flexible ÇÏ°Ô Ç¥ÇöµÇ¾î Æí ÇÒ ¶§µµ ÀÖÁö ¸¸ Á¦ÀÛÀÚ°¡ ÀǵµÇÏÁö ¾ÊÀº ¹æÇâÀ¸·Î Ç¥Çö µÇ´Â °æ¿ì°¡ ¸¹´Ù.
CSS¸¦ »ç¿ë ÇÑ ¹®¼´Â ÀÏ°ü¼ºÀÌ ÇöÀúÈ÷ Áõ°¡ µÈ´Ù.
CSS(Cascading Style Sheet) ÀÇ ´ÜÁ¡
- ¾ç´ë ºê¶ó¿ìÀú°¡ ´Ù¸¥ ¹æ½ÄÀ¸·Î Áö¿ø: °¡Àå Å« °É¸²µ¹Àº Netscape Communicator ¿Í Explorer °¡ ¼·Î ´Ù¸¥ ¹æ½ÄÀ¸·Î ½ºÅ¸ÀÏ ½ÃÆ®¸¦ Áö¿øÇÏ°í Àֱ⠶§¹®¿¡ ¹®Á¦°¡ ÀÖ¾î ÀÎÅÍ³Ý ¹®¼ÀÇ Ç¥ÁØÈ¿¡ Å« °É¸²µ¹ÀÌ µÇ°í ´õ¿í º¸ÆíÈ µÇÁö ¸øÇÏ°í ÀÖ´Â °ÍÀÌ´Ù.
¹®Á¦Á¡À» ÃÖ¼ÒÈÇϱâ À§Çؼ´Â ¾ç´ë ºÎ¶ó¿ìÀú°¡ °øÅëÀûÀ¸·Î »ç¿ëÇÏ´Â ¹æ½Ä ¸¸À» »ç¿ë ÇÏ´Â °ÍÀÌ ÁÁ´Ù.
- ±×·¯³ª ¿¹¹ÎÇÑ Ç¥Çö¿¡¼´Â ¿©·¯°¡Áö·Î ¹®Á¦°¡ ¹ß»ýµÇ´Ï, ¹è¿ì´Â »ç¶÷µéÀº ÇÑ°¡Áö¸¦ ÁßÁ¡ÀûÀ¸·Î °øºÎÇÑ ´ÙÀ½ ´Ù¸¥ ºê¶ó¿ìÀú·Îµµ ¹Ù¸£°Ô Ç¥ÇöÇÏ´Â ¹æ¹ýÀ» Ãß°¡ ÇØ ³ª°¡´Â °ÍÀÌ ÁÁ´Ù.
ÀÌ°÷¿¡¼´Â ´Ù¼Ò º¹ÀáÇϱâ´Â ÇÏÁö¸¸ µÎ°¡Áö ºê¶ó¿ìÀú¸¦ ¼ö¿ëÇϵµ·Ï ³ë·ÂÇÏ¿´À¸³ª, Netscape¿¡¼´Â »êµíÇÏ°Ô Ç¥Çö µÈÁö ¾Ê´Â °æ¿ì°¡ ¸¹ÀÌ ¹ß»ýÇÑ´Ù.
»ç¿ë¹ý Âü°í
- Àû¿ëº¯¼ö
- ±æÀÌ, ¹éºÐÀ², ...
- ÃʱⰪ: µðÆúÆ®(default)
- °¡´ÉÇÑ °ªÀ̳ª Ư¼ºÀº ÇöÀç »ö»óÀ¸·Î, µðÆúÆ®(default)´Â ±½°Ô Ç¥Çö Çß½¿.
|