[CSS] 언어별 줄바꿈 word-wrap / word-break

일단 중요한것

1. 줄바꿈할 텍스트가 들어 있는 요소(block, inline-block) 에 width 값이 명시되어 있어야 한다. 

2. word-wrap 은 영어만 적용된다. 영어 + 아시아권(CJK) 언어에 모두 적용하려면 word-break 를 사용한다. 

 

word-wrap (영어만)

normal :  기본값, 영역을 넘쳐서 이어진다. 
break-word :  영역에 맞추어 줄바꿈 된다.

 

word-break (영어+CJK)

normal : 기본값, 길어져도 그대로 이어져 표시된다. 
break-all : 요소의 크기에 맞춰 줄바꿈 (영어적용, CJK에 적용안됨)
keep-all :  요소의 크기에 맞춰 줄바굼 (영어적용안됨, CJK 적용됨)

 

닥치고 줄바꾸려면

word-break:keep-all

 

break-word 와 break-all  차이

둘아 영어에 적용되지만 

word-wrap:break-word : 줄바꿈을 하지만, 한단어로는 줄바꿈을 하지 않는다. 

workd-break:break-all : 한단어도 줄바꿈을 한다.