ÄÚµù1. ¼öÆò Á¤·Ä left
¼öÆò Á¤·Ä center
¼öÆò Á¤·Ä right
¼öÆò Á¤·Ä text-align:left
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù. ¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.
¼öÆò Á¤·Ä text-align:justify
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù. ¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.

ÄÚµù2. CSS¼öÁ÷ Á¤·Ä text-align:baseline (±âº»°ª)
CSS¼öÁ÷ Á¤·Ä text-align:top
CSS¼öÁ÷ Á¤·Ä text-align:middle
CSS¼öÁ÷ Á¤·Ä text-align:bottom
CSS¼öÁ÷ Á¤·Ä super
CSS¼öÁ÷ Á¤·Ä sub
CSS¼öÁ÷ Á¤·Ä 10px
CSS¼öÁ÷ Á¤·Ä 50%

ÄÚµù3. Çà°£ line-height:150%
The Dawn - DJ Krush
All Mine - Portishead
Karmacoma - Massive Attack
Let Me See - Morcheeba
Aftermath - Tricky
What Does Your Soul... - DJ Shadow
We Have Explosive - Future Sound Of Lond...
I'm Not In Love - Olive
Rise - Nightmares On Wax
Creation - Stereo MC's

Çà°£ line-height:30px
The Dawn - DJ Krush
All Mine - Portishead
Karmacoma - Massive Attack
Let Me See - Morcheeba
Aftermath - Tricky
What Does Your Soul... - DJ Shadow
We Have Explosive - Future Sound Of Lond...
I'm Not In Love - Olive
Rise - Nightmares On Wax
Creation - Stereo MC's

ÄÚµù4. ÀÚ°£ letter-spacing:5pt
The Dawn - DJ Krush
All Mine - Portishead
Karmacoma - Massive Attack
Let Me See - Morcheeba
Aftermath - Tricky
What Does Your Soul... - DJ Shadow
We Have Explosive - Future Sound Of Lond...
I'm Not In Love - Olive
Rise - Nightmares On Wax
Creation - Stereo MC's

ÄÚµù5. ´Ü¾î¿Í ´Ü¾î »çÀÌÀÇ °£°Ý letter-spacing:15pt
The Dawn - DJ Krush
All Mine - Portishead
Karmacoma - Massive Attack
Let Me See - Morcheeba
Aftermath - Tricky
What Does Your Soul... - DJ Shadow
We Have Explosive - Future Sound Of Lond...
I'm Not In Love - Olive
Rise - Nightmares On Wax
Creation - Stereo MC's

ÄÚµù6. µé¿©¾²±â text-indent:18pt
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù.
¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.

ƯÈ÷³ª Çà»ç ÃʹÝ, ¼ð ÄÚ³Ú¸®ÀÇ Áö¸íÀ¸·Î ¹«´ë À§¿¡ ¿À¸¥ ij¼­¸° Á¦Å¸ Á¸½º´Â ÀӽŠ8°³¿ùÀÇ ¹«°Å¿î ¸öÀ» À̲ø°í ±â»µ ¾î¿ ÁÙÀ» ¸ô¶ú´Ù. ij½Ã º£ÀÌÃ÷, ÁÙ¸®¾È ¹«¾î, ¸Þ¸± ½ºÆ®¸³ µî ÀïÀïÇÑ ¹è¿ìµéÀ» ÀçÄ¡°í ¿À½ºÄ«¸¦ °Å¸Ó Áå ±×³àÀÇ ¾î¸®µÕÀýÇÑ Ç¥Á¤Àº È­·ÁÇÑ ÇÁ¸®¸¶µ·³ª º§¸¶ Ä̸®ÀÇ ¿À¸¸ÇÔÀÌ ¾ó¸¶³ª ÈǸ¢ÇÑ ¿¬±â¿´´ÂÁö¸¦ Áõ¸íÇÏ°íµµ ³²¾Ò´Ù. ½ÃÄ«°íÀÇ ¿µ»ó¹Ì¿¡ ¼ÕÀ» µé¾î ÁØ ¾ÆÄ«µ¥¹Ì¿´Áö¸¸, ÀÛǰ»ó±îÁö È®½ÅÇÒ ¼ö´Â ¾ø¾ú´Ù.

'µð¾Æ¿ö½º', '°»½º ¿Àºê ´º¿å' µî ¿¹»ó ¿Ü·Î ºÎÁøÇÑ ¼º°ú¸¦ ³»°í ÀÖ´ø °ÉÀÛµéÀÌ ÃÊÁ¶ÇÏ°Ô ±â´Ù¸®°í ÀÖ¾ú±â ¶§¹®. ±×·¯³ª ¿Ã ¿À½ºÄ« »óÀº 30¿©³â°£ ¿Ü¸éÇß´ø ¹ÂÁöÄà ¿µÈ­¿¡ È®½ÇÇÑ ÇÑ Ç¥¸¦ ´øÁø °ÍÀÌ´Ù.


ÄÚµù7. ³ÐÀÌ width:300px
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù. ¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.

ÄÚµù8. ¾ÈÂÊ ¿©¹é padding:15px, ¹Ù±ùÂÊ ¿©¹é margin:30px
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù. ¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.

ÄÚµù9. ¿Ü°û¼± border:2px solid gray
¹ØÁÙ¼± border:0px solid gray; border-bottom-width:3px

ÄÚµù10. À§Ä¡ ÁöÁ¤ position:relative;top:-13px;

2003³â 75ȸ ¾ÆÄ«µ¥¹Ì ÁÖÁ¦°¡»ó ¼ö»óÀÛǰ
8 Mile (8 ¸¶ÀÏ)
¹®´Ü°ü·Ã ½ºÅ¸ÀÏÀÇ Å°Æ÷ÀÎÆ®
Çà°£ line-height


ÄÚµù11. À̹ÌÁö Á¤·Ä float:left
À۳⿡ ÀÌ¾î ¿ÃÇØÀÇ À̺¯Àº ÁÖÁ¦°¡»ó¿¡¼­ ÅÍÁ³´Ù. µðÆ®·ÎÀÌÆ® µÞ°ñ¸ñ À½¾Ç, ¿¡¹Ì³ÛÀÇ ÈüÇÕÀÌ ½Â¸®ÇÑ °Í. ÀÌ¹Ì Çà»ç ºÒÂüÀǻ縦 ¹àÈù ¿¡¹Ì³ÛÀÇ ¸ð½ÀÀº ¾Æ½±°Ôµµ º¼ ¼ö ¾ø¾úÁö¸¸, ±×¿Í ÇÔ²² ÀÛ¾÷Çß´ø ·çÀ̽º ·¹½ºÅä°¡ ´ë½Å ¼ö»ó¼Ò°¨À» ¹ßÇ¥Çß´Ù. ¿îµ¿º¹ ½ºÅ¸ÀÏ¿¡ Á¤Àå ¸¶À̸¦ °ÉÄ¡°í ³ª¿Â ±×´Â ±× Àǻ󿡼­ºÎÅÍ ½Å¼±ÇÑ ¿­±â¸¦ »Õ¾î³Â´Ù. óÀ½ºÎÅÍ ³¡±îÁö ¸¶¼£(¿¡¹Ì³ÛÀÇ º»¸í)À» °Å·ÐÇϸç âÁ¶ÀûÀÎ ±×¿Í ÇÔ²²Çß´ø À½¾Ç ÀÛ¾÷ÀÇ ±â»ÝÀ» Åä·ÎÇß´Ù. ´õºÒ¾î ¸¶¼£ÀÇ ºÒÂüÀÌ ´ÜÁö ¹Ù»¦±â ¶§¹®À̶ó´Â °ÍÀ» °­Á¶ÇÏ¸ç ±âÀÚȸ°ßÀå¿¡¼± ¼ö»ó¿¡ ´ëÇÑ ±â»ÝÀ» ´ë½Å Àü´ÞÇϱ⵵ Çß´Ù. ½Ã»ó½Ä °£°£È÷ ÁÖÁ¦°¡»ó È帵éÀÇ °ø¿¬ÀÌ À̾îÁ³À¸³ª, 'Lose yourself'¸¦ µéÀ» ¼ö ¾ø¾ú´ø °ÍÀÌ ³¡³» ¾Æ½¬¿òÀ¸·Î ³²¾Ò´Ù.


ÄÚµù12. °ø¹é, ÅÇ, Áٹٲٱ⿡ ´ëÇÑ Ã³¸® white-space:nowrap
È­·ÁÇÑ ½ÃÄ«°íÀÇ ¿­Ç³ÀÌ ÄÚ´Ú ±ØÀåÀ» ÈÛ¾µ¾ú´Ù. ¿¹»óÇß´ø ¹Ù¶óÁö¸¸, 'ÀÛǰ»ó'À» ºñ·ÔÇØ '¹Ì¼ú»ó', 'ÀÇ»ó»ó', 'ÆíÁý»ó', 'À½Çâ»ó'¿¡ '¿©¿ìÁ¶¿¬»ó'±îÁö Â÷ÁöÇÑ ½ÃÄ«°í ÆÀÀº óÀ½ºÎÅÍ ³¡±îÁö ±äÀå ¼Ó ÈïºÐÀ» °¨ÃßÁö ¸øÇß´Ù.