KoXo 자바스크립트 - 스타일 - textUnderlinePosition | text-underline-position (a, acronym, address, ...)

개체의 textDecoration 속성으로 설정된 밑줄 장식의 위치를 반환하거나 설정한다. .

수평 Underline 1 수평 Underline 2 수평 Underline 3

수직 Underline 1
수직 Underline 2
수직 Underline 3

수평 Overline 1

수직 Overline 1

위 두개의 모체 P 엘레멘트로부터 상속받는 textUnderlinePosition 스타일이 자식들에게 적용된다.

<STYLE>
.container p, .container p span, .container span{border:solid 1 blue;background:ffe;padding:5;line-height:2em}
</STYLE>
<DIV class="container">
<P style="text-decoration:underline">
<SPAN style="text-underline-position:above">수평 Underline 1</SPAN>
<SPAN>수평 Underline 2</SPAN>
<SPAN style="text-underline-position:below">수평 Underline 3</SPAN>
</P>
<P style="writing-mode:tb-rl;text-decoration:underline">
<SPAN style="text-underline-position:above">수직 Underline 1</SPAN><BR>
<SPAN>수직 Underline 2</SPAN><BR>
<SPAN style="text-underline-position:below">수직 Underline 3</SPAN><BR>
</P>
<P style="text-decoration:overline">수평 Overline 1</P>
<P style="writing-mode:tb-rl;text-decoration:overline">수직 Overline 1</P>
</DIV>

이 밑줄 장식의 위치는 개체의 텍스트 배치에 상대적이다. 수직 텍스트에서, above 값은 밑줄 장식은 텍스트 이전에 배치되고 텍스트보다 먼저 나타나며, below 값으로, 장식이 텍스트보다 나중에 나타난다.

개체의 textUnderlinePosition 속성값이 auto이고 lang 속성값이 ko이며, writing-mode 속성값이 tb-rl이다.

<DIV style="writing-mode:tb-rl; text-decoration:underline;text-underline-position:auto;line-height:1.5em;height:200;width:250">
<P lang="ko">이 밑줄 장식의 위치는 개체의 텍스트 배치에 상대적이다.
수직 텍스트에서,
<SPAN style="text-underline-position:above;background:eff"><B>above</B> 값은 밑줄 장식은
텍스트 이전에 배치되고 텍스트보다 먼저 나타나며,</SPAN>
<B>below</B> 값으로, 장식이 텍스트보다 나중에 나타난다.</P>
</DIV>

above	장식이 텍스트보다 먼저나온다.
below	장식이 텍스트보다 나중에나온다.
auto	디폴트이며, IE6 이후에서 디폴트값이다. lang 애트리뷰트가 ko, zh 혹은 ja등 극동 언어(언어코드 목록에서 각각 한글, 중국어, 일본어, 등)이고, writing-mode 애트리뷰트가 수직 방향 tb-rl(top bottom - right left)로 설정되면 장식이 영어에서처럼 나중에 나오지 않고 자동적으로 장식이 텍스트보다 먼저 나온다.
auto-pos	IE6 이후 auto와 동일하다.