|
|
|
|
|
|
|
Ã¥³»¿ë |
|
¡Ú ¿ä¾à ¡Ú
À¥À» ¸¸µé±â À§Çؼ´Â »À´ë°¡ µÇ´Â ¸¶Å©¾÷°ú Ç¥ÇöÀ» ÇÏ´Â CSS¸¦ ÀÌÇØÇÏ°í Á¦´ë·Î »ç¿ëÇÒ ÁÙ ¾Ë¾Æ¾ß ÇÑ´Ù. ¸ð¹ÙÀÏ ½Ã´ë·Î ³Ñ¾î°¡¸é¼ À¥À» Á¡Á¡ ´ú »ç¿ëÇÑ´Ù°í »ý°¢ÇÒ ¼öµµ ÀÖÁö¸¸, ¸ð¹ÙÀÏ ½Ã´ë¿¡¼ À¥Å¶(webkit) ±â¹ÝÀÇ ºê¶ó¿ìÀú ȯ°æÀº CSS¸¦ »ç¿ëÇÑ ´Ù¾çÇÑ Ç¥ÇöÀ» Çϱ⠴õ ÁÁÀº ȯ°æÀÌ µÇ¾ú´Ù. ¸ð¹ÙÀÏ À¥À̵ç PCÀ¥À̵ç À¥À» Á¦´ë·Î ¸¸µé±â À§ÇØ ÇÊ¿äÇÑ ¸¶Å©¾÷°ú CSSÀº ÀÌ Ã¥À» ÅëÇØ Á¦´ë·Î ÀÍÈú ¼ö ÀÖ´Ù.
¡Ú ÀÌ Ã¥¿¡¼ ´Ù·ç´Â ³»¿ë ¡Ú
ÀÌ Ã¥Àº ±âº»ÀûÀÎ HTML°ú CSS¸¦ ¾Ë°í ÀÖ´Ù¸é ´©±¸¿¡°Ô³ª µµ¿òÀÌ µÉ ¼ö ÀÖ½À´Ï´Ù. CSS µðÀÚÀο¡ ÀÌÁ¦ ¸· ¹ßÀ» µé¿©³õ¾Ò´ÂÁö, CSS »çÀÌÆ® °³¹ß °æ·ÂÀÌ ¸î ³âÀÎÁö¿¡ °ü°è ¾øÀÌ ÀÌ Ã¥ÀÌ µµ¿òÀÌ µÉ °ÍÀÔ´Ï´Ù. CSS °³¹ß °æÇèÀÌ ÀÖ´Ù¸é ´ëºÎºÐ ³»¿ëÀ» ÀÌÇØÇÒ ¼ö ÀÖÀ» °ÍÀÔ´Ï´Ù. ÇÏÁö¸¸ µ¶ÀÚ°¡ ¾ÆÁ÷ Àü¹®°¡´Â ¾Æ´Ï¶ó°í °¡Á¤ÇÏ°í ÁøÇàÇÕ´Ï´Ù. ÀÌ Ã¥Àº ½Ç¿ëÀûÀÌ°í ½ÇÁ¦ °æÇè¿¡¼ ºñ·ÔµÈ Á¶¾ð°ú ¿¹Á¦¸¦ Á¤¸®ÇÏ°í ÀÖ¾î¼ ÃֽŠCSS µðÀÚÀÎÀ» ¸¶½ºÅÍÇÒ ¼ö ÀÖ°Ô µµ¿ï °ÍÀÔ´Ï´Ù.
¡Ú ÀÌ Ã¥ÀÇ ±¸¼º ¡Ú
¸ÕÀú ±âº»ÀûÀÎ CSS °³³ä, ½ÇÀü »ç·Ê¸¦ ½±°Ô ¼³¸íÇÏ´Â °Í¿¡¼ ½ÃÀÛÇÕ´Ï´Ù. ÄÚµå ±¸¼º ¹æ¹ý°ú ÁÖ¼® ´Ù´Â ¹æ¹ý, CSS Æ÷Áö¼Å´× ¸ðµ¨, Ç÷ÎÆðú Ç÷ÎÆà ÇØÁ¦ ¹æ¹ý µîÀ» ¹è¿ï °ÍÀÔ´Ï´Ù. ÀÌ·± ³»¿ëÀ» ÀÌ¹Ì ¾Ë°í ÀÖÀ»Áö ¸ð¸£°Ú½À´Ï´Ù. ÇÏÁö¸¸ ÀÌ ³»¿ëÀ» ÅëÇØ »õ·Ó°Ô ¾Ë°Ô µÇ°Å³ª ±×µ¿¾È À߸ø ¾Ë°í ÀÖ¾ú´ø ³»¿ëÀ» ¹ß°ßÇÒ °ÍÀÔ´Ï´Ù. µû¶ó¼ ù 3°³ÀÇ ÀåÀº CSS ±âº»¿¡ ´ëÇÑ ÇÙ½É Á¤¸®À̱⵵ Çϸé¼, ÀÌ¹Ì ¾Ë°í ÀÖ¾ú´ø ³»¿ëÀ» ´Ù½Ã ÇÑ ¹ø »ó±âÇÏ´Â ¿ªÇÒµµ ÇØÁÙ °ÍÀÔ´Ï´Ù.
ÀÌ·¸°Ô ±âº»±â¸¦ °®Ãá ÈÄ¿¡ ³ª¿À´Â 5°³ÀÇ ÀåÀº, À̹ÌÁö, ¸µÅ©, ¸®½ºÆ® 󸮳ª Æû, µ¥ÀÌÅÍ Å×ÀÌºí °°Àº ÇÙ½ÉÀûÀÎ CSS ±â¹ýÀ» ´Ù·ì´Ï´Ù. °¢ ÀåÀº °£´ÜÇÑ ¼³¸íÀ¸·Î ½ÃÀÛÇؼ Á¡Á¡ ´õ º¹ÀâÇÑ ¿¹Á¦¸¦ ¹ßÀü½ÃÄÑ ³ª°©´Ï´Ù. ÀÌ ºÎºÐ¿¡¼´Â ¸ð¼¸®°¡ µÕ±Ù »óÀÚ¸¦ ¸¸µå´Â ¹æ¹ý, Åõ¸í ±×¸²ÀÚ È¿°ú »ç¿ë ¹æ¹ý, ÅÇÇü ³»ºñ°ÔÀ̼ǹٸ¦ ¸¸µå´Â ¹æ¹ý, Çø®Ä¿ ½ºÅ¸ÀÏÀÇ À̹ÌÁö¸Ê ¸¸µå´Â ¹æ¹ý µîÀ» ¿¹Á¦·Î ¼³¸íÇÕ´Ï´Ù. ¿¹Á¦ ÄÚµå´Â À¥ »çÀÌÆ®(www.cssmastery.com³ª www.acornpub.co.kr/book/css-mastery-2e)¿¡¼ ´Ù¿î·ÎµåÇÒ ¼ö ÀÖ½À´Ï´Ù.
ºê¶ó¿ìÀú ¹ö±× ¶§¹®¿¡ CSS °³¹ßÀÚµéÀÌ ¸¹Àº °í»ýÀ» ÇÕ´Ï´Ù. ±×·¸±â ¶§¹®¿¡ ÀÌ Ã¥ÀÇ ¿¹Á¦µé¿¡¼´Â ¿©·¯ ºê¶ó¿ìÀú¿¡¼ Àß µ¿ÀÛÇÒ ¼ö ÀÖ°Ô ÇÏ´Â ±â¹ý¿¡µµ ½Å°æÀ» ½è½À´Ï´Ù. »Ó¸¸ ¾Æ´Ï¶ó ÇϳªÀÇ ÀåÀ» ÇÒ¾ÖÇؼ ¹ö±×¿Í ¹ö±×¸¦ ¼öÁ¤ÇÏ´Â ¹æ¹ý¿¡ ´ëÇؼµµ ´Ù·ì´Ï´Ù. ±× Àå¿¡¼´Â ¹ö±×¸¦ ¹ß°ßÇÒ ¼ö ÀÖ´Â ±â¼ú°ú °íÄ¥ ¼ö ÀÖ´Â ¹æ¹ýÀ» ¾Ë¾Æº¾´Ï´Ù. ¶Ç ¸¶ÀÌÅ©·Î¼ÒÇÁÆ® ÀÎÅÍ³Ý ÀͽºÇ÷η¯¿¡¼ CSS ¹ö±×°¡ ³ªÅ¸³ª´Â ÀÌÀ¯¿¡ ´ëÇؼµµ ¹è¿ï °ÍÀÔ´Ï´Ù.
¸¶Áö¸· µÎ °³ÀÇ Àå¿¡¼´Â À¯¸íÇÑ CSS µðÀÚÀ̳ÊÀÎ »çÀÌ¸Õ Äݸ®½¼°ú ij¸Ó·Ð ¸ôÀÌ ÀÌ Ã¥¿¡ ³ª¿Â ±â¹ýÀ» Á¾ÇÕÇØ Á÷Á¢ ¸¸µç ȯ»óÀûÀÎ Àû¿ë »ç·Ê¸¦ ¼³¸íÇÕ´Ï´Ù. µû¶ó¼ °¢ ±â¹ýÀÇ µ¿ÀÛ ¹æ½Ä»Ó¸¸ ¾Æ´Ï¶ó ½ÇÁ¦ À¥ ÇÁ·ÎÁ§Æ®¿¡¼ È°¿ëÇÏ´Â ¹æ¹ý¿¡ ´ëÇØ ¹è¿ì°Ô µÉ °ÍÀÔ´Ï´Ù.
ÀÌ Ã¥Àº óÀ½ºÎÅÍ ½ÃÀÛÇؼ Â÷·Ê´ë·Î Àо µÇ°í, ÄÄÇ»ÅÍ ¿·¿¡ ³öµÎ°í ÇÊ¿äÇÒ ¶§¸¶´Ù ÆÁÀ̳ª ±â¹ýÀ» ã¾Æº¸´Â ¹æ½ÄÀ¸·Î È°¿ëÇϼŵµ µË´Ï´Ù. ¿øÇÏ´Â ´ë·Î È°¿ëÇϼ¼¿ä.
¡Ú ÃßõÀÇ ±Û ¡Ú
À¥ µðÀÚÀÎÀÇ ¼¼°è´Â ³î¶ø½À´Ï´Ù. ¶È°°Àº ¸ð¾çÀ» ¸¸µé±â À§ÇÑ ¹æ¹ýÀÌ ¾î¸²Àâ¾Æ 3,647°¡Áö³ª µË´Ï´Ù. ±×³ª¸¶µµ »õ·Î¿î ¹æ¹ýÀÌ °è¼Ó ³ª¿À°í ÀÖ¾î¼ ÀÌ ¼ýÀÚµµ Á¤È®ÇÏÁö´Â ¾Ê½À´Ï´Ù. ƯÁ¤ ¹®Á¦¸¦ ¹Ù·ÎÀâ´Â ¹æ¹ýÀº ÇÑ °¡Áö°¡ ¾Æ´Ï¶ó ¿©·¯ À¥ µðÀÚÀ̳ʵéÀÌ ¹ß°ßÇÑ ¼ö¸¹Àº ¹æ¹ýµéÀ» ÀÌ¿ëÇÒ ¼ö ÀÖ½À´Ï´Ù. ÀÌ·± ¹æ¹ýµéÀ» ¼±ÅÃÇÒ ¼ö Àֱ⿡ À¥ µðÀÚÀÎÀº Àç¹ÌÀÖ°í Èï¹Ì·Î¿î µ¿½Ã¿¡, ³Ê¹«³ª ¸¹Àº Á¤º¸ ¶§¹®¿¡ Á¤½ÅÀÌ ¾ø±âµµ ÇÏÁÒ. ÀÌ Ã¥Àº Áö³ªÄ¡°Ô ¸¹Àº Á¤º¸¿¡ ÆĹ¯Èù »ç¶÷µé¿¡°Ô È®½ÇÇÑ ¾È³»¸¦ ÇØÁÙ °ÍÀÔ´Ï´Ù.
¾Øµð ¹öµå´Â Áö³ ¸î ³â°£ À¥ Ç¥ÁØ µðÀÚÀÎÀ» À§ÇÑ ¸¹Àº ±Û°ú µðÀÚÀÎÀ» ¹ßÇ¥Çß½À´Ï´Ù. ¸íÈ®ÇÏ°íµµ ½±°Ô µû¶ó Çغ¼ ¼ö ÀÖ´Â ÇÙ½ÉÀûÀÎ CSS ±â¹ýÀÇ ¼³¸íÀÌ ³ì¾Æ ÀÖ´Â ÀÌ·± Ã¥À» Á¢ÇÒ ¼ö ÀÖ´Ù´Â °Ç Á¤¸» Çà¿îÀÔ´Ï´Ù. ¿ì¸® °°Àº À¥ Àü¹®°¡¿¡°Ô´Â ¾ø¾î¼´Â ¾ÈµÉ ¸ðµç Çعý°ú ÆÁÀ» ÇÑ´«¿¡ º¼ ¼ö ÀÖ°Ô ÀÌ Ã¥¿¡ Á¤¸®ÇØ ³õ¾Ò½À´Ï´Ù.
Àú´Â Ç×»ó ¸ñÇ¥¸¦ ´Þ¼ºÇϱâ À§ÇØ ÇÑ °¡Áö ¹æ¹ý¸¸À» ÃßõÇÏ´Â ½ÄÀÇ Ã¥µéÀ» ±×¸® ÁÁ°Ô º¸Áö ¾Ê¾Ò½À´Ï´Ù. ¾Øµð ¹öµå´Â ±×·± ¹æ½Ä°ú ¿ÏÀüÈ÷ ¹Ý´ëÀÇ Á¢±Ù ¹æ¹ýÀ¸·Î ´Ù¾çÇÑ ¹æ½ÄÀ» ¼³¸íÇÕ´Ï´Ù. ¿¹¸¦ µé¾î ¸µÅ© ½ºÅ¸ÀÏÀ» ²Ù¹Î´ÙµçÁö, ÅÇ ³»ºñ°ÔÀ̼ÇÀ» ¸¸µç´ÙµçÁö ÇÒ ¶§ ¿©·¯ °¡Áö ¹æ¹ýÀÌ ÀÖ´Ù°í ¼³¸íÇÏ°í CSS3 ¹æ½ÄÀ¸·Î ºü¸£°Ô ÇØ°áÇÒ ¼ö ÀÖ´Â ¹æ¹ýÀ» »ç¿ëÇϰųª ·¹À̾ƿôÀ» ¸¸µé ¶§µµ °íÁ¤Çü(fixed), È¸é ºñ·ÊÇü(fluid), ±ÛÀÚ ºñ·ÊÇü(elastic)ÀÇ ¿©·¯ °¡Áö ¹æ¹ýÀ» »ç¿ëÇÕ´Ï´Ù. ¶Ç CSS¸¦ »ç¿ëÇؼ µðÀÚÀÎÇÒ ¶§ ºÎµúÈú ¼ö ÀÖ´Â °¢Á¾ ºê¶ó¿ìÀú ¹ö±×¸¦ ÇØ°áÇÏ´Â ¹æ¹ý¿¡ ´ëÇÑ µµ¿òµµ ¼³¸íÇÕ´Ï´Ù. µ¿ÀÏÇÑ ÀϹÝÀûÀÎ ¿¤¸®¸ÕÆ®¶óµµ ´Ù¾çÇÑ ¹æ¹ý°ú ±â¹ýµéÀ» »ç¿ëÇÒ ¼ö ÀÖ°Ô µÇ¸é ÇÊ¿äÇÑ °÷¿¡ °¡Àå Àû´çÇÏ´Ù°í »ý°¢ÇÏ´Â ¹æ½ÄÀ» µµÀÔÇÒ ¼ö ÀÖÀ» °ÍÀÔ´Ï´Ù.
À̻Ӹ¸ ¾Æ´Ï¶ó, µðÀÚÀÌ³Ê µÎ ¸íÀÇ µµ¿òÀ» ¹Þ¾Æ ÀÌ Ã¥¿¡¼ ¼³¸íÇÑ ±â¹ýÀ» Á¾ÇÕÇؼ »çÀÌÆ®¸¦ ¸¸µå´Â ¹æ¹ý±îÁö ´Ù·ç¾ú½À´Ï´Ù. Àú´Â ¿À·¡ ÀüºÎÅÍ Ä³¸Ó·Ð°ú »çÀÌ¸Õ ÀÛ¾÷ÀÇ ÆÒÀ̾ú½À´Ï´Ù. ÀÌ µÎ »ç¶÷ÀÌ ¸¸µç Àû¿ë »ç·Ê¸¦ ÅëÇØ À¯µ¿ÀûÀÌ°í ¹æźÀ¥ÀûÀÎ À¯¿¬ÇÑ ½ºÅ¸ÀÏ ÇعýÀ» º¼ ¼ö ÀÖ´Ù´Â °Ç Á¤¸» ´ë´ÜÇÑ ÇýÅÃÀÌ ¾Æ´Ò ¼ö ¾ø½À´Ï´Ù.
ÀÚ, ±×·³ ¿©·¯ºÐ ½º½º·Î 3,647°¡Áö ¹æ¹ýÀ» Á÷Á¢ ½ÇÇàÇغ¸¸é¼ CSS¸¦ ¸¶½ºÅÍÇϽñ⠹ٶø´Ï´Ù.
- ´í ¾¾´õȨ(Dan Cederholm) / ¡º(°³Á¤ÆÇ) À¥ 2.0À» À̲ô´Â ¹æźÀ¥¡», ¡ºWeb Standards Solution Special Edition Çѱ¹¾îÆÇ¡» ÀúÀÚ
¡Ú ÀúÀÚ ¼¹® ¡Ú
CSS °ü·Ã ÀÚ·á°¡ ¼ö¾øÀÌ ¸¹ÀÌ ³ª¿À°í ÀÖ½À´Ï´Ù. ±×·³¿¡µµ ºÒ±¸ÇÏ°í CSS °ü·Ã °Ô½ÃÆÇ¿¡´Â ÀÌ·± Áú¹®ÀÌ °è¼Ó ¹Ýº¹µË´Ï´Ù. ¡°°¡¿îµ¥ Á¤·ÄÇÏ´Â ·¹À̾ƿôÀº ¾î¶»°Ô ¸¸µå³ª¿ä?¡±, ¡°¸ð¼¸®°¡ µÕ±Ù »óÀÚ¸¦ ¸¸µå´Â °¡Àå ÁÁÀº ¹æ¹ýÀÌ ¹º°¡¿ä?¡±, ¡°3´Ü ·¹À̾ƿô ¸¸µå´Â ¹æ¹ýÀ» ¾Ë·ÁÁÖ¼¼¿ä.¡±
CSS µðÀÚÀÎ °ü·Ã Ä¿¹Â´ÏƼ È°µ¿À» ÇÏ°í ÀÖ´Ù¸é ƯÁ¤ ±â»ç³ª ±â¹ýÀÌ ¼Ò°³µÈ À¥ »çÀÌÆ®µéÀ» ±â¾ïÇÏ°í ÀÖÀ» °ÍÀÔ´Ï´Ù. ÇÏÁö¸¸ CSS¸¦ óÀ½ Á¢Ç߰ųª ¸ðµç À¥ »çÀÌÆ®¸¦ ´Ù ÀÐÀ» ¸¸ÇÑ ½Ã°£ÀÌ ¾ø´Ù¸é ÀÌ·± Á¤º¸¸¦ ´Ù µû¶ó Àâ±â¶õ ½±Áö ¾Ê½À´Ï´Ù.
CSS °ü·Ã ±â¼úÀ» ÀÍÈù »ç¶÷ÀÇ °æ¿ì¿¡µµ À§Ä¡ ÁöÁ¤ ¸ðµ¨À̳ª ÁöÁ¤ ¼øÀ§ °°Àº ¹®Á¦¸¦ È®½ÇÇÏ°Ô ÀÌÇØÇÏÁö ¸øÇؼ ¹®Á¦¿¡ ºÀÂøÇÒ ¼ö ÀÖ½À´Ï´Ù. ´ëºÎºÐÀÇ CSS ÀÛ¾÷ÀÚµéÀÌ Àüü ½ºÆåÀ» ¿ÏÀüÈ÷ ¼ÒÈÇÏÁö ¸øÇÑ »óÅ¿¡¼ µ¶ÇÐÀ¸·Î ´Ù¸¥ »ç¶÷ÀÌ ¾´ ±ÛÀ̳ª Äڵ带 º¸°í Çϳª¾¿ ±â¼úÀ» ÀÍÇû±â ¶§¹®ÀÔ´Ï´Ù. ¶ÇÇÑ CSS ¸í¼¼¼´Â ³Ê¹« º¹ÀâÇؼ À¥ °³¹ßÀÚ°¡ ¾Æ´Ï¶ó À¥ ºê¶ó¿ìÀú °³¹ßÀÚ¸¦ À§ÇØ ÀÛ¼ºµÈ °Í °°½À´Ï´Ù.
±×¸®°í ºê¶ó¿ìÀú¸¶´ÙÀÇ Æ¯¼ºÀ» °í·ÁÇØ¾ß ÇÑ´Ù´Â Á¡ÀÌ ÀÖ½À´Ï´Ù. ºê¶ó¿ìÀú ¹ö±×¿Í ºñÀÏ°ü¼ºÀº CSS ÀÛ¾÷ÀÚ¿¡°Ô °¡Àå Å« °ñÄ©°Å¸®ÀÔ´Ï´Ù. ºÒÇàÇÏ°Ôµµ ´ëºÎºÐÀÇ ÀÌ·± ¹ö±×µéÀº ¹®¼È°¡ Àß µÇ¾î ÀÖÁö ¾Ê°í ÇØ°á ¹æ¹ýµµ ¸î¸î »ç¶÷¸¸ ¾Ë°í ÀÖ½À´Ï´Ù. ƯÁ¤ ¹æ¹ýÀ» »ç¿ëÇÏÁö ¾ÊÀ¸¸é ºê¶ó¿ìÀú¿¡ µû¶ó ´Ù¸¥ °á°ú°¡ ³ª¿Ã ¼ö ÀÖ½À´Ï´Ù. ÇØ°áÇß´Ù ÇÏ´õ¶óµµ ¾î¶² ºê¶ó¿ìÀú¿¡¼ ¾î¶² ¹®Á¦°¡ ¹ß»ýÇß´ÂÁö ÀÏÀÏÀÌ ±â¾ïÇÒ ¼öµµ ¾ø½À´Ï´Ù.
¹Ù·Î ÀÌ·± ÀÌÀ¯ ¶§¹®¿¡ ÀÌ Ã¥À» ¾²°Ô µÆ½À´Ï´Ù. °¡Àå À¯¿ëÇÑ CSS ±â¹ýÀ» Çѹø¿¡ Á¤¸®ÇÏ¸é¼ ½ÇÁ¦ ȯ°æ¿¡¼ ¹ß»ýÇÒ ¼ö ÀÖ´Â ºê¶ó¿ìÀú °ü·Ã À̽´¸¦ ´Ù·ï CSS °ü·Ã Áö½Ä ¼öÁØÀ» ÇÑ ´Ü°è ¿Ã¸± ¼ö ÀÖ°Ô Çϱâ À§Çؼ ¸»ÀÔ´Ï´Ù. ÀÌ Ã¥À» ÅëÇØ CSS Àü¹®°¡´Ù¿î Äڵ带 ÀÛ¼ºÇÒ ¼ö ÀÖ´Â ±â¹ýÀ» ¾Ë·Áµå¸®°íÀÚ ÇÕ´Ï´Ù.
¡Ú ¿Å±äÀÌÀÇ ¸» ¡Ú
ÀÌ Ã¥ÀÇ ¹ø¿ªº» ÃÊÆÇÀÌ ³ª¿ÔÀ» ¶§´Â À¥Ç¥ÁØÀ» »õ·Ó°Ô °³Ã´ÇØ¾ß ÇÏ´Â ºÐ¾ß¶ó°í ÀνÄÇÏ´Â ½Ã±â¿´½À´Ï´Ù. »õ·Î¿î °³³ä¿¡ ´ëÇؼ ÀÌÇØÇÏ°í ¿¬±¸ÇÏ¸é¼ Ç¥ÁØ¿¡ ¸Â´Â À¥, Á¢±Ù¼º ÁÁÀº À¥À» ¸¸µå´Â ¹æ¹ý¿¡ ´ëÇؼ ¼·Î °øºÎ¸¦ ÇÏ´ø ½Ã±â¿´½À´Ï´Ù. ¶Ç ºê¶ó¿ìÀúº°·Î ´Ù¸¥ ȯ°æ¾È¿¡¼ À¥Ç¥ÁØ¿¡ ¸ÂÃá ¸¶Å©¾÷ ¹× CSS¸¦ Àû¿ëÇÏ´Â µ¥ ÀÖ¾î ¸¹Àº »ç¶÷µéÀÌ °í»ýÀ» Çß½À´Ï´Ù.
ÇÏÁö¸¸ ½Ã°£ÀÌ ¸¹ÀÌ Èê·¯ ÀÌÁ¦ ºê¶ó¿ìÀúÀÇ Ã³¸® ¹æ½Äµµ ¼·Î ºñ½ÁÇØÁö¸é¼ ±×¸®°í ¸ðµÎ°¡ Á¡Á¡ Ç¥ÁØ¿¡ ¸Â´Â ¸¶Å©¾÷ ¹× CSS¸¦ Àû¿ëÇß°í, ÀÌÁ¦´Â ´ç¿¬È÷ Ç¥ÁØ¿¡ ¸Â´Â ¸¶Å©¾÷°ú CSS°¡ ¾÷°è Ç¥ÁØÀÌ µÇ¾ú½À´Ï´Ù. ±×¸®°í »ç¶÷µéÀÌ ³¯¸¶´Ù »ç¿ëÇÏ´Â ºê¶ó¿ìÀúµµ ½Ã°£ÀÌ Áö³ª¸é¼ Á¡Á¡ ÃֽŠºê¶ó¿ìÀú·Î ¾÷±×·¹ÀÌµå µÇ¸é¼ È¯°æµµ ´õ ÁÁ¾ÆÁ³½À´Ï´Ù. ¶Ç ¸ð¹ÙÀÏÀÇ »ç¿ëÀÌ ¸¹¾ÆÁö¸é¼ ¸ð¹ÙÀÏ È¯°æ¿¡¼´Â °ÅÀÇ ´ëºÎºÐÀÇ ±â±â°¡ À¥Å¶(webkit) ±â¹ÝÀÇ À¯»çÇÑ ¼öÁØÀÇ ºê¶ó¿ìÀú¸¦ »ç¿ëÇϱ⠶§¹®¿¡ ¾ÕÀ¸·Îµµ À¥À» Á¦´ë·Î Ç¥ÇöÇϱâ À§ÇÑ ¸¶Å©¾÷°ú CSS È°¿ë¿¡ ÀÖ¾î¼ ´õ ÁÁÀº ȯ°æÀÌ µÇ°í ÀÖ½À´Ï´Ù.
ÀÌ Ã¥ÀÇ ¹ø¿ª ÀÛ¾÷À» ¸¶Ä¡°í ½ÇÁ¦ °³Á¤ÆÇÀÌ ³ª¿À±â±îÁö ½Ã°£ Â÷ÀÌ°¡ ÀÖ°í ±×°£ ȯ°æ º¯Èµµ ÀÖ¾úÁö¸¸, ÀÌ Ã¥ÀÇ ³»¿ëÀº À¯È¿ÇÏ°í ¾ÕÀ¸·Îµµ °è¼Ó ±×·² °ÍÀÔ´Ï´Ù. À¥À̶ó´Â ±â¹ÝÀ» ÅëÇؼ ¼ºñ½º¸¦ Á¦°øÇÏ°í ÄÜÅÙÆ®¸¦ °øÀ¯ÇÏ´Â ÇÑ ¸»ÀÌÁÒ. ±×»Ó ¾Æ´Ï¶ó Á¤º¸ ´ÜÀ§¸¦ Á¦´ë·Î ±¸¼ºÇϱâ À§ÇÑ ¸¶Å©¾÷ÀÇ ±¸Á¶, °èÃþÀûÀΠǥÇöÀ» Àß Çϱâ À§ÇÑ CSSÀÇ °³³äÀº ±â¼úÀÇ º¯È¿Í »ó°ü¾øÀÌ Á¤º¸¸¦ Ç¥ÇöÇÏ´Â º»ÁúÀÌ ¹Ù²îÁö ¾Ê´Â ÇÑ È¯°æ°ú »ó°ü¾øÀÌ ±âº»À¸·Î ÀÍÇô¾ß ÇÏ´Â Áß¿äÇÑ °³³äÀÔ´Ï´Ù. |
|
¸ñÂ÷ |
|
1Àå ±âÃÊ ´ÙÁö±â
__±¸Á¶°¡ źźÇÑ ÄÚµå ¸¸µé±â
____¸¶Å©¾÷ÀÇ ¿ª»ç
______ÀǹÌÀÇ Á߿伺
______ID¿Í Ŭ·¡½º À̸§ Áþ±â
______¿¤¸®¸ÕÆ® À̸§
______ID ¶Ç´Â Ŭ·¡½º »ç¿ë
______div¿Í span
______¸¶ÀÌÅ©·ÎÆ÷¸Ë
______HTML°ú CSS ¹öÀü
____¹®¼ À¯Çü, DOCTYPE Àüȯ, ºê¶ó¿ìÀú ¸ðµå
____À¯È¿¼º °Ë»ç
______ºê¶ó¿ìÀú ¸ðµå
______DOCTYPE Àüȯ
__¿ä¾à
2Àå ½ºÅ¸ÀÏÀ» ²Ù¹Ð ´ë»ó ¼±ÅÃÇϱâ
__¼±ÅÃÀÚ È°¿ë ±âÃÊ
______À¯»ç Ŭ·¡½º ¼±ÅÃÀÚ
__Àüü ¼±ÅÃÀÚ
__°í±Þ ¼±ÅÃÀÚ
______ÀÚ½Ä ¼±ÅÃÀÚ, ÀÎÁ¢ ÇüÁ¦ ¼±ÅÃÀÚ
______¼Ó¼º ¼±ÅÃÀÚ
__ij½ºÄÉÀ̵å È¿°ú¿Í Àû¿ë ¼ø¼
______ÁöÁ¤ ¼øÀ§
______½ºÅ¸ÀϽÃÆ®¿¡¼ ÁöÁ¤ ¼øÀ§ È°¿ëÇϱâ
______body ű׿¡ Ŭ·¡½º³ª ID ÁöÁ¤Çϱâ
______½ºÅ¸ÀϽÃÆ®¸¦ °èȹ ±¸¼º °ü¸®ÇÏ´Â ¹æ¹ý
__¹®¼¿¡ ½ºÅ¸ÀÏ Àû¿ëÇϱâ
______±¸Á¶ Ç¥½Ã¸¦ À§ÇÑ ÁÖ¼®
______ÀÛ¾÷ ±â·ÏÀ» À§ÇÑ ÁÖ¼®
______ÁÖ¼®À» Á¦°ÅÇÏ°í ½ºÅ¸ÀϽÃÆ® ÃÖÀûÈÇϱâ
__½ºÅ¸ÀÏ °¡À̵å
__¿ä¾à
3Àå ȸé Ç¥½Ã¸¦ À§ÇÑ ¸ðµ¨ ¿Ïº® Á¤¸®
__¹Ú½º ¸ðµ¨ ¿Ïº® Á¤¸®
______ÀÎÅÍ³Ý ÀͽºÇ÷η¯ÀÇ ¹Ú½º ¸ðµ¨
______¸¶Áø °ãħ Çö»ó
__Æ÷Áö¼Å´× ¿Ïº® Á¤¸®
______ȸé Ç¥½Ã ¸ðµ¨
______»ó´ë À§Ä¡
______Àý´ë À§Ä¡
______°íÁ¤ À§Ä¡
______Ç÷ÎÆÃ
__¶óÀÎ ¹Ú½º¿Í Ç÷ÎÆ® ÇØÁ¦ ¹æ¹ý
__¿ä¾à
4Àå ¹è°æ À̹ÌÁö¿Í À̹ÌÁö ´ëÄ¡ ±â¹ý
__¹è°æ À̹ÌÁö ±âÃÊ ´ÙÁö±â
______°íÁ¤Æø µÕ±Ù ¸ð¼¸® »óÀÚ
__µÕ±Ù ¸ð¼¸® »óÀÚ ¸ð¾ç ¸¸µé±â
______À¯µ¿Æø µÕ±Ù ¸ð¼¸® »óÀÚ
______¸¶¿îƾž ÄÚ³Ê
______º¹¼ö ¹è°æ À̹ÌÁö
______border-radius
______border-image
__±×¸²ÀÚ È¿°ú
______°£´ÜÇÑ ±×¸²ÀÚ È¿°ú ³»±â
______Clagnut ½ºÅ¸ÀÏ ±×¸²ÀÚ È¿°ú
______Box-shadow
______CSS Åõ¸íµµ
__Åõ¸íµµ
______RGBa
______PNG Åõ¸íµµ
______½ÃÁ¡Â÷¸¦ È°¿ëÇÑ ¿òÁ÷ÀÌ´Â ¹è°æ ±â¹ý
__À̹ÌÁö ´ëÄ¡ ±â¹ý
______FIR ¹æ¹ý
______ÆÄÅ© ¹æ¹ý
______sIFR ¹æ¹ý
__¿ä¾à
5Àå ¸µÅ© ¸ð¾ç ²Ù¹Ì±â
__¸µÅ© ½ºÅ¸ÀÏ ±âÃÊ
__¹ØÁÙ Ä¡¸ç ³î±â
______±âº» ¸µÅ© ²Ù¹Ì±â
______¿¹»Û ¸µÅ© ¹ØÁÙ ¸¸µé±â
__¹æ¹®Çß´ø ¸µÅ© ½ºÅ¸ÀÏ
__¸µÅ© ´ë»ó¿¡ ½ºÅ¸ÀÏ ÀÔÈ÷±â
__¸µÅ© À¯Çüº°·Î ½ºÅ¸ÀÏ ÁöÁ¤Çϱâ
______¹®¼³ª ´º½º ÇÇµå ´Ù¿î·Îµå¿ë ¸µÅ© ²Ù¹Ì±â
__¹öưó·³ º¸ÀÌ´Â ¸µÅ©
______·Ñ¿À¹ö ±âÃÊ
______À̹ÌÁö¸¦ »ç¿ëÇÑ ·Ñ¿À¹ö È¿°ú
______ÇȽà ¹æ¹ýÀ» ÀÌ¿ëÇÑ ·Ñ¿À¹ö È¿°ú
______CSS ½ºÇÁ¶óÀÌÆ®
______CSS3¸¦ »ç¿ëÇÑ ·Ñ¿À¹ö
__CSS·Î¸¸ ¸¸µå´Â ÅøÆÁ
__¿ä¾à
6Àå ¸®½ºÆ® ½ºÅ¸ÀÏ°ú ³»ºñ°ÔÀ̼Ç
__¸®½ºÆ® ½ºÅ¸ÀÏ ±âÃÊ
__¼¼·ÎÇü ³»ºñ°ÔÀ̼ǹ٠¸¸µé±â
__³»ºñ°ÔÀ̼ǹٿ¡¼ ÇöÀç ÆäÀÌÁö Ç¥½ÃÇϱâ
__´Ü¼øÇÑ °¡·ÎÇü ³»ºñ°ÔÀ̼ǹÙ
__À̹ÌÁö¸¦ »ç¿ëÇÑ ³»ºñ°ÔÀ̼ǹÙ
__½½¶óÀ̵ù µµ¾î È¿°úÀÇ ÅÇ ³»ºñ°ÔÀ̼ǹ٠¸¸µé±â
__CSS µå·Ó´Ù¿î
__CSS À̹ÌÁö¸Ê ¸¸µé±â
______Çø®Ä¿ ½ºÅ¸ÀÏÀÇ À̹ÌÁö¸Ê ¸¸µé±â
__¸®¸ðÆ® ·Ñ¿À¹ö ¸¸µé±â
__Á¤ÀÇ ¸®½ºÆ®
__¿ä¾à
7Àå Á¢±Ù¼º ³ôÀº Æû°ú Å×ÀÌºí ¸¸µé±â
__µ¥ÀÌÅÍ Å×ÀÌºí ½ºÅ¸ÀÏ ²Ù¹Ì±â
______Å×ÀÌºí °ü·Ã ¿¤¸®¸ÕÆ® ¼Ò°³
________½á¸Ó¸®¿Í ĸ¼Ç
________thead, tbody, tfoot
________col, colgroup
______µ¥ÀÌÅÍ Å×ÀÌºí ¸¶Å©¾÷ ¸¸µé±â
______Å×ÀÌºí ½ºÅ¸ÀÏ ²Ù¹Ì±â
______È¸é ¸ð¾ç ¸¸µé±â
__°£´ÜÇÑ Æû ·¹À̾ƿô ¸¸µé±â
______À¯¿ëÇÑ Æû ¿¤¸®¸ÕÆ®
______Æû ·¹À̺í
______±âº» ·¹À̾ƿô
______±âŸ ¿¤¸®¸ÕÆ® ó¸® ¹æ¹ý
______Àå½Ä ¸¶¹«¸®
______Çʼö ÀÔ·Â Ç׸ñ
__º¹ÀâÇÑ Æû ·¹À̾ƿô ¸¸µé±â
______Á¢±Ù¼ºÀ» °í·ÁÇÑ µ¥ÀÌÅÍ ÀÔ·Â ¹æ½Ä
______´Ù´Ü ·¹À̾ƿôÀÇ Ã¼Å© ¹Ú½º
______¼ºê¹Ô ¹öÆ°
______Æû ¿¡·¯ ¸Þ½ÃÁö ¸¸µé±â
__¿ä¾à
8Àå ·¹À̾ƿô
__·¹À̾ƿô °èȹ ¼ö¸³
__±â¹Ý ±¸Á¶ Á¤ÀÇ
______°¡¿îµ¥ ·¹À̾ƿô ¸¸µé±â
__Ç÷ÎÆ® ±â¹ÝÀÇ ·¹À̾ƿô
______Ç÷ÎÆ®¸¦ ÀÌ¿ëÇÑ 2´Ü ·¹À̾ƿô
______Ç÷ÎÆ®¸¦ ÀÌ¿ëÇÑ 3´Ü ·¹À̾ƿô
__°íÁ¤ ·¹À̾ƿô, À¯µ¿ ·¹À̾ƿô
______È¸é ºñ·ÊÇü ·¹À̾ƿô
______±ÛÀÚ ºñ·ÊÇü ·¹À̾ƿô
______±ÛÀÚ¿Í È¸é Å©±â¿¡ µû¶ó ´Ã¾î³ª´Â À̹ÌÁö
__°¡Â¥ ´Ü ¸ð¾ç ¸¸µé±â
__µ¿ÀÏ ³ôÀÌ ´Ù´Ü ±¸Á¶
__CSS3 Ä÷³
__CSS ÇÁ·¹ÀÓ¿öÅ© vs CSS ½Ã½ºÅÛ
__¿ä¾à
9Àå ºê¶ó¿ìÀú ¹ö±× ÇØ°áÇϱâ
__ÈçÈ÷ ¹ß»ýÇÏ´Â CSS ¹®Á¦
______¹ö±× Àâ±â
______ÁöÁ¤ ¼øÀ§¿Í Á¤·Ä ¹æ¹ý ¿À·ù
______¸¶Áø °ãħ Çö»ó
______¹ö±× Àâ±â ±âÃÊ
______óÀ½ºÎÅÍ ¹ö±× ¸¸µéÁö ¾Ê±â
______¹®Á¦ ºÐ¸®Çϱâ
______Å×½ºÆ® ¹üÀ§ ÃÖ¼ÒÈÇϱâ
______Áõ»óÀÌ ¾Æ´Ñ ¹®Á¦ ¿øÀÎ ¹Ù·Î Àâ±â
______µµ¿ò ¿äû
__·¹À̾ƿô
______·¹À̾ƿôÀ̶õ
______·¹À̾ƿô ¶§¹®¿¡ »ý±â´Â È¿°ú
__¹®Á¦ ÇØ°á
______ÀÎÅÍ³Ý ÀͽºÇ÷η¯ Á¶°Ç ÁÖ¼®¹®
______ÇÙ°ú ÇÊÅÍ »ç¿ë¿¡ ´ëÇÑ °æ°í
______ÇÙ »ç¿ë ½Ã À¯ÀÇÁ¡
______¹êµå Æнº ÇÊÅÍ
______º°Ç¥ HTML ÇÊÅÍ
______ÀÚ½Ä ¼±ÅÃÀÚ ÇÙ
______´õºí ¸¶Áø Ç÷ÎÆ® ¹ö±×
__ÈçÈ÷ ¹ß»ýÇÏ´Â ¹ö±× ÇØ°á ¹æ¹ý
______ÅؽºÆ® ÁÖº¯¿¡ 3Çȼ¿ °ø°£ Ç¥½Ã ¹ö±×
______IE 6ÀÇ ¹®ÀÚ Áߺ¹ Ç¥½Ã ¹ö±×
______IE 6ÀÇ ÇÇÄ¿ºÎ ¹ö±×
______»ó´ë ÁÂÇ¥ ÄÁÅ×À̳ʿ¡¼ Àý´ë ÁÂÇ¥ ÁöÁ¤
______ÀÎÅÍ³Ý ÀͽºÇ÷η¯ °ü·Ã À̾߱â
__´Ü°èÀû ºê¶ó¿ìÀú Áö¿ø
__¿ä¾à
10Àå ÄÉÀ̽º ½ºÅ͵ð: ·Î¸¶ ÀÌÅ»¸®¾Æ
__ÄÉÀ̽º ½ºÅ͵𠰳¿ä
__±â¹Ý ±¸Á¶
______HTML5 ¹Ì¸® º¸±â
______reset.css
__1080 ·¹À̾ƿô°ú ±×¸®µå
______À¥ µðÀÚÀΰú ±×¸®µå
__°í±Þ CSS2¿Í CSS3 ±â´Éµé
______Dowebsitesneedtolookexactlythesameineverybrowser.com
______¼Ó¼º ¼±ÅÃÀÚ
______Box-shadow, RGBa, text-overflow
______1999³â½Ä font-size ÁöÁ¤
__ÆùÆ® ¿¬°á°ú ´õ ³ªÀº À¥ ŸÀÌÆ÷±×·¡ÇÇ
______²Ù¹Ò ±¸µÎÁ¡
______´Ù´Ü ±¸Á¶ ÅؽºÆ® ·¹À̾ƿô
______@font-face
______Cufon, @font-face·ÎÀÇ Áß°£ °úÁ¤
__AJAX¿Í jQuery¸¦ »ç¿ëÇÑ ÀÎÅÍ·¢¼Ç
______AJAX
______jQuery
______AJAX¿Í jQuery °Ë»ö »ç¿ë
__¿ä¾à
11Àå ÄÉÀ̽º ½ºÅ͵ð: Ŭ¶óÀÓ ´õ ¸¶¿îƾ½º
__ÄÉÀ̽º ½ºÅ͵𠰳¿ä
__½ºÅ¸ÀϽÃÆ® ±¸¼º ¹× ±ÔÄ¢
______Á¦ÀÏ ¸¹ÀÌ »ç¿ëÇÏ´Â screen.css
______¼³¸í ºÙÀ̱â
______ÃʱâÈ
______Á¶°Ç ÁÖ¼®À» »ç¿ëÇÑ ÀÎÅÍ³Ý ÀͽºÇ÷η¯¿ë ½ºÅ¸ÀϽÃÆ®
__ÀÚÀ¯·Î¿î ±×¸®µå »ç¿ë
______¿¹Á¦ »çÀÌÆ®ÀÇ ·¹À̾ƿô
__Ŭ·¡½º¸¦ »ç¿ëÇÑ ³»ºñ°ÔÀ̼Ç
______ÇöÀç ÆäÀÌÁö ÇÏÀ̶óÀÌÆ®
______Àο뱸 Ç¥½Ã
__¿¤¸®¸ÕÆ® Ÿ±êÆÃ
______ÇÏÀ§ ¼±ÅÃÀÚ
______:first-child ÀÇ»ç ¼±ÅÃÀÚ
______ÀÎÁ¢ ÇüÁ¦ ¼±ÅÃÀÚ
__Åõ¸íµµ, ±×¸²ÀÚ, µÕ±Ù ¸ð¼¸®
______¸ñÇ¥
______¼³¸í À̹ÌÁö °ãħ Ç¥Çö ¹× RGBa Åõ¸íµµ
______Ŭ·¡½º °áÇÕ
______border-radius
______box-shadow
__¸ñ·Ï À§Ä¡/±¸¼º ¹× ÄÜÅÙÆ® Ç¥Çö
______µ¿±Ù ¸ð¼¸®
______µî°í¼± Â÷Æ® Ç¥Çö
__¿ä¾à |
|
|
|
ÀúÀÚ
|
|
¾Øµð ¹öµå
»ç¿ëÀÚ °æÇè µðÀÚÀÎ ÄÁ¼³ÆÃÀ» Çϴ Ŭ¸®¾î·¹ÇÁÆ®(clearleft.com)ÀÇ °øµ¿ â¾÷ÀÚ Áß ÇÑ ¸íÀÔ´Ï´Ù. ÀÎÅÍ·¢¼Ç µðÀÚÀΰú »ç¿ë¼º Àü¹®°¡·Î¼ À¥ µð·º¼ÇÁî(Web Directions), À̺¥Æ® ¾îÆÄÆ®(An Event Apart), SXSW µî ±¹Á¦ÀûÀÎ ÄÜÆÛ·±½º¿¡¼ °»ç·Î È°¾àÇÏ°í ÀÖ½À´Ï´Ù. ¿µ±¹ÀÇ Àαâ ÀÖ´Â µðÀÚÀÎ ÄÜÆÛ·±½º Áß ÇϳªÀÎ µðÄÁ½ºÆ®·°Æ®(dConstruct, dconstruct.org)¸¦ ÁÖ°üÇϱ⵵ ÇÏ°í ¿µ±¹¿¡¼ °¡Àå óÀ½ »ç¿ë¼º, Á¤º¸ ¼³°è, »ç¿ëÀÚ °æÇè¿¡ ´ëÇØ ´Ù·é µðÀÚÀÎ Çà»çÀÎ UX ·±´ø(UX London,unlondon.com)À» Ã¥ÀÓÁö°í ÀÖ½À´Ï´Ù. ¿µ±¹ ³»¿¡¼ Ãʱ⿡ À¥ Ç¥ÁØÀ» »ç¿ëÇÑ Àü¹®°¡ Áß ÇÑ »ç¶÷À¸·Î CSS ½ºÆå°ú Å©·Î½º ºê¶ó¿ìÀú Áö¿ø µî¿¡ ´ëÇÑ ³»¿ëÀÇ Àü¹®°¡ÀÔ´Ï´Ù. ÀÌ·± ºÐ¾ßÀÇ Ä¿¹Â´ÏƼ È°µ¿¿¡µµ Àû±ØÀûÀÎ ±×´Â ¼ö Â÷·Ê ±¹Á¦ÀûÀÎ µðÀÚÀÎ °ü·Ã ¾î¿öµåÀÇ ½É»ç¸¦ Çß°í ÇöÀç´Â [´å³Ý(.Net)] ÀâÁö»çÀÇ °í¹® ¿ªÇÒÀ» ÇÏ°í ÀÖ½À´Ï´Ù. ¶Ç ¸Æ¿¡¼ »ç¿ëÇÏ´Â ºñ½ÎÁö ¾ÊÀº »ç¿ë¼º Å×½ºÆ® µµ±¸ÀÎ ½Ç¹ö¹é(silverbackapp.com)À» ¸¸µé ¼ö ÀÖ°Ô ÃßÁøÇÑ »ç¶÷ Áß ÇϳªÀÔ´Ï´Ù. Æ®À§ÅÍ(@andybudd)¸¦ ¿½ÉÈ÷ ¾²¸ç °¡²û¾¿ ÀÚ½ÅÀÇ ºí·Î±×(andybudd.com)¿¡ ±ÛÀ» ¾¹´Ï´Ù. ¿´ë Çغ¯¿¡¼ ´ÙÀ̺ùÇÏ´Â °ÍÀ» °¡Àå ÁÁ¾ÆÇؼ PADI ´ÙÀ̺ù ±³À° ÀÚ°ÝÁõÀ» º¸À¯ÇÏ°í ÀÖÀ¸¸ç ¿¹Àü¿¡´Â »ó¾î Á¶·Ã»ç °æÇèµµ ÀÖ´Ù°í ÇÕ´Ï´Ù.
|
|
|
ij¸Ó·Ð ¸ô
ij¸Ó·ÐÀº 1990³â´ëºÎÅÍ ±â´É°ú º¸¿©Áö´Â ¸ð¾çÀÌ Àß ¾î¿ï¸®´Â ÀÇ¹Ì ÀÖ´Â À¥ ÀÎÅÍÆäÀ̽º¸¦ ¸¸µé¾î¿Ô½À´Ï´Ù. ±×°¡ Á÷Á¢ ¼öÇàÇϰųª Âü¿©ÇÑ ÀÛ¾÷µéÀº HOW, Print, Communication Arts°ú °°Àº ÀâÁö³ª Æ÷·¹½ºÅÍ ¸®¼Ä¡(Forrester Research), NPR(National Public Radio) µî ¼ö¸¹Àº °÷¿¡ ¼Ò°³µÇ¾ú½À´Ï´Ù. °¢Á¾ ÄÁÆÛ·±½º¿¡¼ »ç¿ëÀÚ ÀÎÅÍÆäÀ̽º µðÀÚÀο¡ ´ëÇؼ °ÀǸ¦ Çϱ⵵ Çß°í [Mobile Web Design](mobilewebbook.com)À̶ó´Â Ã¥À» ¾²±âµµ Çß½À´Ï´Ù. À¥°ú Å©¸®¿¡ÀÌƼºê ºÐ¾ß¿¡ ´ëÇÑ Á¾»çÀÚµé°ú ±×µéÀ» ä¿ëÇÏ·Á´Â ȸ»çµéÀÌ ¹æ¹®ÇÏ´Â »çÀÌÆ®ÀÎ ¿À½ëƽ À⽺(Authentic Jobs Inc.)ÀÇ Ã¢¾÷ÀÚÀÌÀÚ ´ëÇ¥ÀÔ´Ï´Ù. ¶Ç ŸÀÌÆ÷±×·¡ÇǸ¦ Áß½ÉÀ¸·Î ÇÑ Æ÷½ºÅ͸¦ Á¦ÀÛÇϴ ij¸Ó·Ð ¸ô(Cameron Moll LLC)À̶ó´Â ±â¾÷À» ¼ÒÀ¯ÇÏ°í ÀÖ°í ÀÌ°÷ÀÇ Á¦Ç°Àº cameronmall.bigcartel.com¿¡¼ ±¸ÀÔÇÒ ¼ö ÀÖ½À´Ï´Ù. ÀÌ·¸°Ô ¼ö¸¹Àº ÀÏÀ» Çϸ鼵µ ±×´Â ³× ¸íÀÇ ¾ÆÀ̵é°ú °°ÀÌ °ø³îÀ̸¦ Áñ±â´Â »ýÈ°À» ÇÕ´Ï´Ù. cameronmoll.com, twitter.com/cameronmoll, flickr.com/photos/authentic, vimeo.com/camero nmall µî ¿Â¶óÀÎ °ø°£¿¡¼ ij¸Ó·ÐÀ» ¸¸³ªº¼ ¼ö ÀÖ½À´Ï´Ù.
|
|
|
»çÀÌ¸Õ Äݸ®½¼
Àç´É ÀÖ´Â µðÀÚÀÌ³Ê¿Í °³¹ßÀÚµéÀÌ ¸ð¿© ¶Ù¾î´Â °á°ú¹°À» ¸¸µå´Â ¾î½ºÅ² µðÀÚÀÎ(Erskine Design,erskinedesign.com)ÀÇ °øµ¿ â¾÷ÀÚÀÌÀÚ Å©¸®¿¡ÀÌƼºê µð·ºÅÍÀÔ´Ï´Ù. Áö³ 10³â ÀÌ»ó ·¹ÄÚµå ȸ»ç, À¯¸í À½¾Ç ¾ÆƼ½ºÆ®,ºñÁÖ¾ó ¾ÆƼ½ºÆ®, °¢Á¾ ±â¾÷, Á¤ºÎ°ü·Ã µî °ÅÀÇ ¸ðµç ºÐ¾ß¿¡ °ÉÄ£ ¼ö¸¹Àº À¥ ÇÁ·ÎÁ§Æ®¸¦ ¼öÇàÇß½À´Ï´Ù. ÇöÀç´Â À¯¸í ÀâÁö»ç¿¡¼ºÎÅÍ ±ØÁö¹æ ŽÇè°¡¿¡ °ÉÄ¡´Â ´Ù¾çÇÑ Å¬¶óÀ̾ðÆ®¿Í ÀÛ¾÷À» ÇÏ°í ÀÖ½À´Ï´Ù. ¿À·¡ ÀüºÎÅÍ ½á¿Â ºí·Î±×(colly.com) ÀÌ¿Ü¿¡µµ À¥°ú °ü·ÃµÈ À̾߱â´Â ErskineLabs(erskinelabs.com)¿¡ Àû°í ÀÖ°í º£½ºÆ® ¼¿·¯ÀÎ [Beginning CSS Web Development](Apress)ÀÇ ÀúÀÚÀÌÀÚ [Web Standards Creativity]ÀÇ °øµ¿ÀúÀÚÀ̱⵵ ÇÕ´Ï´Ù. CSS¿Í HTMLÀ» °¡Áö°í ´Ù¾çÇÑ ½ÇÇèÀ» Çϰųª ûÁß ¾Õ¿¡¼ ±×·± ÁÖÁ¦·Î À̾߱âÇÒ ¶§ °¡Àå ÇູÇØ ÇÕ´Ï´Ù. µî»êÀ» ÁÁ¾ÆÇؼ ¿µ±¹À̳ª ¾ÆÀ̽½¶õµåÀÇ ÀÚ¿¬À» ŽÇèÇÏ´Â °ÍÀ» ÁÁ¾ÆÇÕ´Ï´Ù. 32³â µÈ Â÷¸¦ ¿îÀüÇÏ¸ç ºñ¾îÆäÀ̽º¶ó´Â À̸§ÀÇ °í¾çÀÌ¿Í ÇÔ²² »ì°íÀÖ½À´Ï´Ù.
|
|
|
ij¸Ó·Ð ¸ô, »çÀÌ¸Õ Äݸ®½¼
|
|
¿ªÀÚ
|
|
¹Ú¼ö¸¸
¸íÁö´ëÇб³ ÄÄÇ»ÅÍ°øÇаú ÇÐºÎ¿Í ´ëÇпø(¼ÒÇÁÆ®¿þ¾î °øÇÐ Àü°ø)À» Á¹¾÷ÇßÀ¸¸ç, ¿¡ÀÌÄÜ ÃâÆǻ翡¼ Æì³½ [½Ç¿ë¿¹Á¦·Î ¹è¿ì´Â À¥ Ç¥ÁØ](2005³â), [CSS ¸¶½ºÅÍ Àü·«](2006³â), [¹æ¾îÇü À¥»çÀÌÆ® ±âȹ](2008³â), [(°³Á¤ÆÇ) À¥ 2.0À» À̲ô´Â ¹æźÀ¥](2009³â), [Tagging űë](2011³â)À» ¹ø¿ªÇß´Ù. ¹ÌÅõµ¥ÀÌ¿Í ³×À̹ö ¹êµå »ç¾÷À» ÃÑ°ý ±âȹÇÑ ±×´Â 2013³â ºñÆ®ÆÐÅ·ÄÄÆÛ´Ï(http://beatpacking.com)¸¦ ÅëÇØ ´Ù½Ã ÇÑ ¹ø â¾÷ÇÏ°í, »õ·Î¿î ¸ð¹ÙÀÏ À½¾Ç ¼ºñ½º¸¦ Á¦°øÇÏ°í ÀÖ´Ù. ´õÀÚ¼¼ÇÑ Á¤º¸´Â ±×ÀÇ °³ÀÎÀ¥»çÀÌÆ®(http://sumanpark.com)¿¡¼ º¼ ¼ö ÀÖ´Ù.
|
Web Standards Solutions(À¥ Ç¥ÁØ Ã¹°ÉÀ½)(Special Edition) | ¹Ú¼ö¸¸ | ¿¡ÀÌÄÜÃâÆÇ
|
|
Á¤À¯ÇÑ
¼¿ï´ëÇб³ ÄÄÇ»ÅÍ°øÇаú¸¦ Á¹¾÷ÇÏ°í Á¤º¸¼³°è/UXÀü¹®°¡·Î ¿©·¯ ±â¾÷ÀÇ ´Ù¾çÇÑ ¼ºñ½º¸¦ ¼³°èÇÏ°í ÀÖ´Ù. [À¥µðÀÚÀÎ 2.0 °í±Þ CSS](2008³â), [HTML5 ù°ÉÀ½] (2010³â), [The Design of Sites Çѱ¹¾îÆÇ](2011³â) µî ±âȹ, µðÀÚÀÎ, °³¹ß ¿©·¯ ¿µ¿ªÀÇ ¹ø¿ªÀ» ´ã´çÇß´Ù.
|
|
|
¹Ú¼ö¸¸, Á¤À¯ÇÑ
|
|
|
|
|
|
|
|
Ãâ°í¾È³» |
|
|
Ãâ°í¶õ ÀÎÅÍÆÄÅ© ¹°·ùâ°í¿¡¼ µµ¼°¡ Æ÷ÀåµÇ¾î ³ª°¡´Â ½ÃÁ¡À» ¸»Çϸç, ½ÇÁ¦ °í°´´Ô²²¼ ¼ö·ÉÇϽô ½Ã°£Àº »óÇ°Áغñ¿Ï·áÇØ Ãâ°íÇÑ ³¯Â¥ + Åùè»ç ¹è¼ÛÀÏÀÔ´Ï´Ù. |
|
ÀÎÅÍÆÄÅ© µµ¼´Â ¸ðµç »óÇ°ÀÇ Àç°í°¡ ÃæÁ·ÇÒ ½Ã¿¡ ÀÏ°ý Ãâ°í¸¦ ÇÕ´Ï´Ù. |
|
ÀϺΠÀç°í¿¡ ´ëÇÑ Ãâ°í°¡ ÇÊ¿äÇÒ ½Ã¿¡´Â ´ã´çÀÚ¿¡°Ô Á÷Á¢ ¿¬¶ôÇϽðųª, °í°´¼¾ÅÍ(°í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ôÁֽñ⠹ٶø´Ï´Ù. |
|
¹è¼Ûºñ ¾È³» |
|
|
ÀÎÅÍÆÄÅ© µµ¼ ´ë·®±¸¸Å´Â ¹è¼Û·á°¡ ¹«·áÀÔ´Ï´Ù. |
|
´Ü, 1°³ÀÇ »óÇ°À» ´Ù¼öÀÇ ¹è¼ÛÁö·Î ÀÏ°ý ¹ß¼Û½Ã¿¡´Â 1°³ÀÇ ¹è¼ÛÁö´ç 2,000¿øÀÇ ¹è¼Ûºñ°¡ ºÎ°úµË´Ï´Ù. |
¾Ë¾ÆµÎ¼¼¿ä! |
|
|
°í°´´Ô²²¼ ÁÖ¹®ÇϽŠµµ¼¶óµµ µµ¸Å»ó ¹× ÃâÆÇ»ç »çÁ¤¿¡ µû¶ó Ç°Àý/ÀýÆÇ µîÀÇ »çÀ¯·Î Ãë¼ÒµÉ ¼ö ÀÖ½À´Ï´Ù. |
|
Åùè»ç ¹è¼ÛÀÏÀÎ ¼¿ï ¹× ¼öµµ±ÇÀº 1~2ÀÏ, Áö¹æÀº 2~3ÀÏ, µµ¼, »ê°£, ±ººÎ´ë´Â 3ÀÏ ÀÌ»óÀÇ ½Ã°£ÀÌ ¼Ò¿äµË´Ï´Ù.
(´Ü, Åä/ÀÏ¿äÀÏ Á¦¿Ü) |
|
|
|
|
ÀÎÅÍÆÄÅ©µµ¼´Â °í°´´ÔÀÇ ´Ü¼ø º¯½É¿¡ ÀÇÇÑ ±³È¯°ú ¹ÝÇ°¿¡ µå´Â ºñ¿ëÀº °í°´´ÔÀÌ ÁöºÒÄÉ µË´Ï´Ù.
´Ü, »óÇ°À̳ª ¼ºñ½º ÀÚüÀÇ ÇÏÀÚ·Î ÀÎÇÑ ±³È¯ ¹× ¹ÝÇ°Àº ¹«·á·Î ¹ÝÇ° µË´Ï´Ù.
±³È¯/¹ÝÇ°/º¸ÁõÁ¶°Ç ¹× Ç°Áúº¸Áõ ±âÁØÀº ¼ÒºñÀڱ⺻¹ý¿¡ µû¸¥ ¼ÒºñÀÚ ºÐÀï ÇØ°á ±âÁØ¿¡ µû¶ó ÇÇÇظ¦ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
Á¤È®ÇÑ È¯ºÒ ¹æ¹ý ¹× ȯºÒÀÌ Áö¿¬µÉ °æ¿ì 1:1¹®ÀÇ °Ô½ÃÆÇ ¶Ç´Â °í°´¼¾ÅÍ(1577-2555)·Î ¿¬¶ô Áֽñ⠹ٶø´Ï´Ù.
¼ÒºñÀÚ ÇÇÇغ¸»óÀÇ ºÐÀïó¸® µî¿¡ °üÇÑ »çÇ×Àº ¼ÒºñÀÚºÐÀïÇØ°á±âÁØ(°øÁ¤°Å·¡À§¿øȸ °í½Ã)¿¡ µû¶ó ºñÇØ º¸»ó ¹ÞÀ» ¼ö ÀÖ½À´Ï´Ù.
|
±³È¯ ¹× ¹ÝÇ°ÀÌ °¡´ÉÇÑ °æ¿ì |
|
|
»óÇ°À» °ø±Þ ¹ÞÀ¸½Å ³¯·ÎºÎÅÍ 7ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
°ø±Þ¹ÞÀ¸½Å »óÇ°ÀÇ ³»¿ëÀÌ Ç¥½Ã, ±¤°í ³»¿ë°ú ´Ù¸£°Å³ª ´Ù¸£°Ô ÀÌÇàµÈ °æ¿ì¿¡´Â °ø±Þ¹ÞÀº ³¯·ÎºÎÅÍ 3°³¿ùÀ̳», ±×»ç½ÇÀ» ¾Ë°Ô µÈ ³¯ ¶Ç´Â ¾Ë ¼ö ÀÖ¾ú´ø ³¯·ÎºÎÅÍ 30ÀÏÀ̳» °¡´ÉÇÕ´Ï´Ù. |
|
»óÇ°¿¡ ¾Æ¹«·± ÇÏÀÚ°¡ ¾ø´Â °æ¿ì ¼ÒºñÀÚÀÇ °í°´º¯½É¿¡ ÀÇÇÑ ±³È¯Àº »óÇ°ÀÇ Æ÷Àå»óÅ µîÀÌ ÀüÇô ¼Õ»óµÇÁö ¾ÊÀº °æ¿ì¿¡ ÇÑÇÏ¿© °¡´ÉÇÕ´Ï´Ù.
|
|
|
|
±³È¯ ¹× ¹ÝÇ°ÀÌ ºÒ°¡´ÉÇÑ °æ¿ì |
|
|
|
°í°´´ÔÀÇ Ã¥ÀÓ ÀÖ´Â »çÀ¯·Î »óÇ° µîÀÌ ¸ê½Ç ¶Ç´Â ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. (´Ü, »óÇ°ÀÇ ³»¿ëÀ» È®ÀÎÇϱâ À§ÇÏ¿© Æ÷Àå µîÀ» ÈѼÕÇÑ °æ¿ì´Â Á¦¿Ü) |
|
½Ã°£ÀÌ Áö³²¿¡ µû¶ó ÀçÆǸŰ¡ °ï¶õÇÒ Á¤µµ·Î ¹°Ç°ÀÇ °¡Ä¡°¡ ¶³¾îÁø °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
Æ÷Àå °³ºÀµÇ¾î »óÇ° °¡Ä¡°¡ ÈÑ¼ÕµÈ °æ¿ì´Â ºÒ°¡´ÉÇÕ´Ï´Ù. |
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ¹ÝÇ° ȯºÒ |
|
|
|
´Ù¹è¼ÛÁöÀÇ °æ¿ì ´Ù¸¥ Áö¿ªÀÇ ¹ÝÇ°À» µ¿½Ã¿¡ ÁøÇàÇÒ ¼ö ¾ø½À´Ï´Ù. |
|
1°³ Áö¿ªÀÇ ¹ÝÇ°ÀÌ ¿Ï·áµÈ ÈÄ ´Ù¸¥ Áö¿ª ¹ÝÇ°À» ÁøÇàÇÒ ¼ö ÀÖÀ¸¹Ç·Î, ÀÌÁ¡ ¾çÇØÇØ Áֽñ⠹ٶø´Ï´Ù. |
|
|
|
|
|
|