css word-break

출처 :https://wit.nts-corp.com/2017/07/25/4675

word-break 속성과 word-wrap 속성
실무에서 두 속성은 주로 줄 바꿈을 위해 사용한다. 먼저 각 속성이 무엇인지 간단히 살펴보자.

word-break : 아래 예제와 같이 단어의 분리를 어떻게 할 것인지 결정한다.
ex) (공백/띄어쓰기) 날씨가·좋아요
ex) (음절) 날·씨·가·좋·아·요·

word-wrap : 아래 예제와 같이 박스의 가로 영역을 넘친 단어 내에서 임의의 분리 여부를 결정한다.
ex)1234zcvgdaeryyujkoouddsh


word-break 속성 값의 중단점

[non-CJK]
normal (기본값)
  : 중단점: 공백(띄어쓰기, 하이픈’-‘)
break-all
  : 중단점: 음절


[CJK]
normal (기본값)
: 중단점: 음절
break-all
  : 중단점: 음절
keep-all (CJK에만 적용됨)
: 중단점: 공백(띄어쓰기, 하이픈’-‘, 그 외 기호)