CSS 참조 가이드

CSS @규칙(RULES)

CSS 속성 전체

CSS3 text-decoration-style 속성 CSS3 text-decoration-color 속성

CSS3 text-decoration-line 속성 사용 방법 및 예제

이 text-decoration-lineCSS 속성은 요소에 추가되는 모자이크 패턴을 지정합니다. 이 속성은 하나나 여러 개의 공백으로 구분된 값을 받을 수 있습니다.

다음 표는 이 속성의 사용 설명과 버전 기록, 그리고 JavaScript 스크립트에서 이 속성을 사용하는 문법을 설명합니다。

기본 값:	none
적용 대상:	모든 요소. ::first에도 적용됩니다。-letter와::first-line。
thừa kế:	없음
애니메이션 가능:	아니요。참조하십시오: 애니메이션 속성。
버전：	CSS3의 새 기능
JavaScript 문법：	object.style.textDecorationLine="underline"

text-decoration-line 사용 문법

이 속성의 문법은 다음과 같습니다：

text-decoration-line:　none　|　[　underline　|　overline　|　line-through　|　blink　]　one　or　more　values　|　initial　|　inherit

다음 예제는 text를 사용하는 방법을 보여줍니다.-decoration-line 속성。

예제

p　{
　　　　-moz-text-decoration-line:　underline;　/*　Firefox　*/
　　　　text-decoration-line:　underline;　
}
p.multiple　{
　　　　-moz-text-decoration-line:　underline　overline;　/*　Firefox　*/
　　　　text-decoration-line:　underline　overline;　
}

테스트를 해보세요‹/›

속성 값

다음 표는 이 속성의 값을 설명합니다。

값	설명
none	텍스트에 장식이 없습니다. 기본 값입니다。
underline	각 행 텍스트에 하이픈이 있습니다.
overline	각 행 텍스트의 위쪽에 줄이 있습니다.
line-through	각 행 텍스트의 중간에 줄이 있습니다.
blink	텍스트가 보이는 상태와 보이지 않는 상태 사이에서 반복적으로 깜박이게 합니다. 이 값을 사용하는 것은 권장되지 않으며, 대신 사용하십시오애니메이션。
initial	이 속성을 기본 값으로 설정합니다。
inherit	지정된 경우, 관련 요소는 부모 요소의 text를 사용합니다.-decoration-line 속성 값。

브라우저 상호 운용성

text-decoration-line 대부분의 브라우저는 이 속성을 지원하지 않습니다。

	Firefox 6+ ^-moz-，36+ Google Chrome× Internet Explorer × Apple Safari × Opera ×

경고:text-decoration-line 대부분의 브라우저는 이 속성을 지원하지 않습니다. 이 속성을 사용하는 것을 피하는 것이 좋습니다。

더 읽기

다음 튜토리얼을 참조하십시오:CSS 텍스트，CSS 경계선。

CSS3 text-decoration-style 속성 CSS3 text-decoration-color 속성