개체 속에서 글자와 글자 사이의 추가적인 거리를 반환하거나 설정한다.
| normal | 디폴트이며, 디폴트 간격이다. |
| (길이) | 부동소수점수치 다음에 cm, mm, in, pt, pc나 px 등 길이 단위가 따르는 절대 길이, 혹은 em or ex 등의 단위가 따르는 상대 길이이다. CSS 길이단위를 참조하라. |
이 속성은 currentStyle에서는 읽기전용이고, 그외의 개체에서는 읽기/쓰기이며, 디폴트값은 normal이다.
CSS(Cascading Style Sheets) 애트리뷰트는 상속된다.
길이 값이 양수이면, letter-spacing 애트리뷰트는 엘레멘트 속에서 지정된 값을 글자와 글자 디폴트 간격에 추가한다. 값이 음수이면 디폴트 간격이 그만큼 줄어든다. 글자 간격은 정렬에 의하여 영향을 받을 수 있다.
| 개체 | script | CSS | IE 버전 |
|---|
이 속성은 CSS1(Cascading Style Sheets, Level 1)에서 정의되었다.
<STYLE>button{width:50}</STYLE>
<DIV id=divObj style="letter-spacding:1em;">지정된 글자 간격이 적용된다.</DIV>
<BUTTON onclick="divObj.style.letterSpacing='';">디폴트</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='-.2em';">-.2em</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='.2em';">.2em</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='1em';">1em</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='-10px';">-10px</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='-5px';">-5px</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='1px';">1px</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='5px';">5px</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='10px';">10px</BUTTON>
<BUTTON onclick="divObj.style.letterSpacing='10pt';">10pt</BUTTON>
onmouseover 이벤트로 글자간격을 조정한다.
<DIV onmouseover="this.style.letterSpacing='3mm';" onmouseout="this.style.letterSpacing='';">여기에 마우스를 올려보라.</DIV>