• 회원가입
  • 로그인
  • 구글아이디로 로그인

[DOM_Style] JS - wordSpacing 속성 - 텍스트 단어간 간격 (= 단어간격 = word-spacing속성 = 워드스페이싱속성, 상속O)

wordSpacing 예제 

 

<p id="hz">홈짱닷컴 Homzzang.com</p>


<button type="button" onclick="homzzang()">클릭</button>


<script>

function homzzang() {

  document.getElementById("hz").style.wordSpacing = "50px";

}

</script>


결과보기 

 

wordSpacing 정의 

 

단어 사이 간격 설정/반환. 

 


 

1.

letterSpacing 속성

문자간의 간격 

 

2.

기본값: normal

반환값: word-spacing 속성값을 나타내는 문자열

CSS속성: word-spacing
CSS버전: CSS1

3.

모든 브라우저 지원. 

 

 

wordSpacing 구문 

 

[접근]

object.style.wordSpacing 

 

[설정]

object.style.wordSpacing = "normal|length|initial|inherit"

 


[속성값]

 

normal

기본 간격 (기본값)


length (px 단위, cm단위, em단위 등)

숫자 클수록 간격 넓어짐 (음수 가능

※ 단어를 다닥다닥 붙게 하려면 보통 -10px 줌. 

 

initial

이 속성의 기본값으로 설정

 

inherit

부모 요소의 속성값 상속.   

 



분류 제목
DOM_Style JS - textDecorationStyle 속성 - 텍스트라인모양 (굵은선, 파선, 점선, 물결선 등) (…
DOM_Style JS - textIndent 속성 - 텍스트 들여쓰기/내어쓰기 (= textIndent속성 = 텍스트인덴트속…
DOM_Style JS - textJustify -
DOM_Style JS - textOverflow 속성 - 영역 벗어난 글자 처리 (= 영역이탈글자처리 = 텍스트오버플로속성 …
DOM_Style JS - textShadow 속성 - 글자그림자 (= text-shadow속성 = 글자음영 = 텍스트섀도, …
DOM_Style JS - textTransform 속성 - 텍스트 대소문자변환 (= textTransform속성 = 텍스트트…
DOM_Style JS - top -
DOM_Style JS - transform -
DOM_Style JS - transformOrigin -
DOM_Style JS - transformStyle -
DOM_Style JS - transition -
DOM_Style JS - transitionProperty -
DOM_Style JS - transitionDuration -
DOM_Style JS - transitionTimingFunction -
DOM_Style JS - transitionDelay -
DOM_Style JS - unicodeBidi 속성 - 텍스트글자방향 (= unicodeBidi속성 = 유니코드비디속성)
DOM_Style JS - userSelect -
DOM_Style JS - verticalAlign 속성 - 텍스트수직정렬 (= 버티컬얼라인속성)
DOM_Style JS - visibility 속성 ★ - 보임설정 (= 노출설정 = visibility속성 = 비저빌러티속성…
DOM_Style JS - whiteSpace -
9/10
목록
찾아주셔서 감사합니다. Since 2012