[CSS] 단어단위로 줄바꿈을 하고싶어 ...word-break

word-break : 아래 예제와 같이 단어의 분리를 어떻게 할 것인지 결정한다.

속성 값 : normal(기본값), break-all, keep-all 
ex) (공백/띄어쓰기) 날씨가·좋아요
ex) (음절) 날·씨·가·좋·아·요·

 

중단점은 ‘·’ 로 표기

‘word-break: normal;’

한·글·좋·아·요, 这·是·一·些·汉·字,·and·some·Latin

‘word-break: break-all;’

한·글·어·좋·아·요, 这·是·一·些·汉·字,·a·n·d·s·o·m·e·L·a·t·i·n

* ‘word-break: keep-all;’

한글·좋아요,这是一些汉字,·and·some·Latin

 

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

속성 값 : normal(기본값), break-word 가 있다.
ex)

'word-break: normal;'

* 'word-break: break-word;'

 

 

속성의 역할은 다르지만 줄 바꿈을 위한 것이다,

또한 조합하여 선언하기도 한다.