News & Notice
  • ÇѾçÁ¤º¸±â¼úÀÇ ÃÖ±Ù ¼Ò½ÄÀ» ¾Ë·Áµå¸³´Ï´Ù.
°øÁö»çÇ×
Á¦ ¸ñ Responsive Web[¹ÝÀÀÇü À¥]
±Û¾´ÀÌ ¿î¿µÀÚ
±ÛÁ¤º¸ Hit : 1721, Date : 2014/06/23 13:26
Responsive Web[¹ÝÀÀÇü À¥] :
ÃÖ±Ù ´Ù¾çÇÑ ¸ð¹ÙÀÏ ±â±â°¡ º¸±ÞµÇ¸é¼­ ÇϳªÀÇ »çÀÌÆ®¸¦ ¸¸µé´õ¶óµµ µ¥½ºÅ©Å¾ / ¸ð¹ÙÀÏ Æù / Ÿºí·¿ PC µî ¼­·Î ´Ù¸¥ Çػ󵵸¦ °¡Áø µð¹ÙÀ̽ºµéÀ» °í·ÁÇÏÁö ¾ÊÀ» ¼ö ¾ø°Ô µÇ¾ú´Ù. µ¥½ºÅ©Å¾ Çϳª¸¸ º¸´õ¶óµµ ¿ÍÀ̵åÀÇ °íÇØ»óµµ µð½ºÇ÷¹ÀÌ°¡ È®»êµÊ¿¡ µû¶ó ¸¹Àº »çÀÌÆ®µéÀÌ ±âÁ¸ÀÇ 1024*768 Å©±â¸¦ ³Ñ¾î Á¡Â÷ »çÀÌÁ Å°¿ö°¡°í ÀÖ´Â Ãß¼¼ÀÌÁö¸¸ ±×·¸´Ù°í ÇϳªÀÇ Çػ󵵿¡¸¸ ¸ÂÃç »çÀÌÆ®¸¦ Á¦ÀÛÇϱ⵵ ¾î·Æ´Ù. ÀÌ·¸µí N-ScreenÀÇ ½Ã´ë·Î ºÒ¸®´Â ´Ù¾çÇÑ µð¹ÙÀ̽ºÀÇ Çػ󵵿¡ ¸ÂÃç »çÀÌÆ®ÀÇ ·¹À̾ƿôÀ» º¯È¯ÇÏ´Â À̽´¿¡ ¸ÂÃç µîÀåÇÑ °ÍÀÌ ¹ÝÀÀÇü À¥(Responsive Web)ÀÌ´Ù.


¹ÝÀÀÇü À¥ÀÇ ÁÖ¿ä ÄÁ¼ÁÀº ´ÙÀ½°ú °°´Ù.
1. A flexible, grid-based layout : ±×¸®µå¸¦ »ó´ëÀû(% ´ÜÀ§ µî)À¸·Î ÁöÁ¤ÇÏ¿© ºê¶ó¿ìÀú Å©±â¿¡ µû¶ó À¯µ¿ÀûÀ¸·Î º¯È¯ 
2. Flexible width media: images, video : ³Êºñ°¡ º¯°æµÇ¾îµµ À¥ÆäÀÌÁö ¾ÈÀÇ ¹Ìµð¾î°¡ ³ÑÄ¡Áö ¾Ê°Ô ÇÏ´Â ±â¹ý
3. Media queries : ´Ù¾çÇÑ ºê¶ó¿ìÀú¿¡¼­ Ç¥Çö¾ç½ÄÀ» Á¦¾îÇÒ ¼ö ÀÖ°Ô °í¾ÈµÈ ±â´É
µî·ÏÀÚ   ºñ¹Ð¹øÈ£