Untitled Document

¼Ó¼º°ª.. ±× ù¹ø°.

1. box¼Ó¼º

½ºÅ¸ÀϽÃÆ®´Â ¸ðµç ¿ä¼Ò´Â ¿©·¯ °ãÀÇ »óÀÚ·Î µÑ·¯½×¿© ÀÖ´Ù°í °¡Á¤ÇÑ´Ù. margin, border, padding ¼Ó¼ºÀ» ÀÌ¿ëÇØ °¢°¢ÀÇ ÆøÀ̳ª »öÀ» Á¶Á¤ÇÒ ¼ö ÀÖ´Ù.
°£´ÜÇÏ°Ô ±×¸²À¸·Î Ç¥½ÃÇÏ¸é ¾Æ·¡¿Í °°´Ù.

3) margin-top

¼Ó¼º°ª:length£üpercentage£üauto
¿ÞÂÊ ¸¶ÁøÀÇ ÆøÀ» Á¤ÇÑ´Ù. ¸ðµç element¿¡ Àû¿ëÇÒ ¼ö ÀÖ°í ÃʱⰪÀº 0ÀÌ´Ù.

IMG{margin-top:12px}

2) margin-right
¼Ó¼º°ª:length£üpercentage£üauto
¿ÞÂÊ ¸¶ÁøÀÇ ÆøÀ» Á¤ÇÑ´Ù. ¸ðµç element¿¡ Àû¿ëÇÒ ¼ö ÀÖ°í ÃʱⰪÀº 0ÀÌ´Ù.
4) margin-bottom

¼Ó¼º°ª:length£üpercentage£üauto
¿ÞÂÊ ¸¶ÁøÀÇ ÆøÀ» Á¤ÇÑ´Ù. ¸ðµç element¿¡ Àû¿ëÇÒ ¼ö ÀÖ°í ÃʱⰪÀº 0ÀÌ´Ù.

1) margin-left
¼Ó¼º°ª:length£üpercentage£üauto
¿ÞÂÊ ¸¶ÁøÀÇ ÆøÀ» Á¤ÇÑ´Ù. ¸ðµç element¿¡ Àû¿ëÇÒ ¼ö ÀÖ°í ÃʱⰪÀº 0ÀÌ´Ù.
5) margin

¼Ó¼º°ª:length£üpercentage£üauto
³× °÷ÀÇ ¸¶ÁøÀ» µ¿½Ã¿¡ Á¤ÇÑ´Ù.
¼¼ ¹ø°ó·³ 3°³ÀÇ ¼Ó¼º°ªÀ» ÁöÁ¤ÇÏ¸é µÎ¹ø° °ªÀº ¿Þ
ÂÊ°ú ¿À¸¥ÂÊ ¿©¹é¿¡ Àû¿ëµÈ´Ù.
³× ¹ø° ¿¹¿Í °°ÀÌ 4¹æÇâÀ» °¢°¢ ÀÔ·ÂÇÏ´Â °æ¿ì´Â ´ÙÀ½°ú °°ÀÌ ½Ã°è ¹æÇâÀ¸·Î ÀÔ·ÂÇØ¾ß ÇÑ´Ù. {margin: top right bottom left }

body {margin: 2em } /* ¸ðµç ¸¶ÁøÀÌ 2em*/
body {margin:1em 2em} /* top°ú bottomÀº 1em, right left 2em*/
body {margin: 1em 2em 3em} /* topÀº1em, left¿Í right´Â 2em, bottomÀº 3em*/
body {margin: 1em, 2em, 3em, 4em} /*topÀº 1em, left´Â 2em, right´Â 3em, bottomÀº 4em*/

6) padding-top

¼Ó¼º°ª:length£üpercentage

À­ÂÊ ÆеùÀÇ ÆøÀ» Á¤ÇÑ´Ù. ÃʱⰪÀº 0ÀÌ´Ù.

7) padding-right

¼Ó¼º°ª:length£üpercentage

¿À¸¥ÂÊ ÆеùÀÇ ÆøÀ» Á¤ÇÑ´Ù. ÃʱⰪÀº 0ÀÌ´Ù.

8) padding-bottom

¼Ó¼º°ª: length£üpercentage

¾Æ·¡ÂÊ ÆеùÀÇ ÆøÀ» Á¤ÇÑ´Ù. ÃʱⰪÀº 0ÀÌ´Ù.

9) padding-left

¼Ó¼º°ª:length£üpercentage

¿ÞÂÊ ÆеùÀÇ ÆøÀ» Á¤ÇÑ´Ù. ÃʱⰪÀº 0ÀÌ´Ù.

10) padding

¼Ó¼º°ª:length£üpercentage

³× °÷ÀÇ Æеù ÆøÀ» µ¿½Ã¿¡ Á¤ÇÑ´Ù.
³× ¹ø° ¿¹¿Í °°ÀÌ 4¹æÇâÀ» °¢°¢ ÀÔ·ÂÇÏ´Â °æ¿ì´Â ´ÙÀ½°ú °°ÀÌ ½Ã°è ¹æÇâÀ¸·Î ÀÔ·ÂÇØ¾ß ÇÑ´Ù. {padding: top right bottom left }
»ç¿ë¹æ½ÄÀº À§ÀÇ ¸¶Áø°ú °°´Ù.

H1{ background: white, padding:1em 2em;}

<ÀÌÀü   ¸ñ·Ï   ´ÙÀ½>

Copyright ¨Ï2001¡­2003, alza.wo.to All Rights Reserved.