text-decoration 속성
text-decoration 속성은
텍스트에 밑줄, 취소선, 윗줄과 같은
다양한 효과를 추가합니다.
문법
선택자 {
text-decoration: underline | line-through | overline | none;
}
값
| 값 | 설명 |
|---|---|
underline |
밑줄이 그어진 텍스트를 만듭니다. |
line-through |
취소선이 그어진 텍스트를 만듭니다. |
overline |
텍스트 위에 줄을 만듭니다. |
none |
요소의 밑줄을 제거합니다. 기본적으로 밑줄이 있는 링크에 가장 자주 사용됩니다. |
기본값: none. 링크의
기본값: underline.
예제 . underline 값
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration: underline;
}
:
예제 . line-through 값
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration: line-through;
}
:
예제 . overline 값
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
text-decoration: overline;
}
:
같이 보기
-
선의 스타일을 변경할 수 있는 속성
text-decoration-style -
선의 색상을 변경할 수 있는 속성
text-decoration-color -
선의 위치를 변경할 수 있는 속성
text-decoration-line
