text-decoration 속성을 사용하면 텍스트를 몇가지 형태로 꾸밀 수 있습니다.

<p style="text-decoration:underline">underline 속성값이 적용된 예문입니다.</p>
<p style="text-decoration:overline">overline 속성값이 적용된 예문입니다.</p>
<p style="text-decoration:line-through">line-through 속성값이 적용된 예문입니다.</p>
<p style="text-decoration:blink">blink 속성값이 적용된 예문입니다.</p>

underline 속성값이 적용된 예문입니다.

overline 속성값이 적용된 예문입니다.

line-through 속성값이 적용된 예문입니다.

blink 속성값이 적용된 예문입니다.

blink 속성값은 인터넷익스플로러(IE)에서는 효과가 나타나지 않습니다. 글자가 깜박이는 효과인데 파이어폭스(FireFox)에서는 제대로 나타납니다.

blink 속성값을 확인하실려면 파이어폭스를 설치하고 확인하면 됩니다.

text-decoration 속성값을 하이퍼링크의 스타일을 지정하는데 많이 사용합니다.

기본적으로 하이퍼링크는 underline 속성값이 지정된 상태입니다. 그래서 이 underline을 없애는 경우가 많습니다.

<style type="text/css">
a:link { text-decoration: none;}
a:visited { text-decoration: none;}
a:active { text-decoration: none;}
a:hover {text-decoration:underline;}
</style>

<a href="http://www.homejjang.com">홈짱닷컴</a>은 초보자를 위한 홈페이지 제작가이드입니다.


출처 - http://www.homejjang.com/07/text-decoration.php



'Development > CSS' 카테고리의 다른 글

CSS를 이용한 마우스 커서 모양 지정  (0) 2012.06.14
CSS - font 설정  (1) 2012.06.10
JS와 CSS의 문자셋 지정  (0) 2012.06.01
CSS - !important  (0) 2012.05.31
CSS - Font-Weight  (0) 2012.05.30
Posted by linuxism
,