줄바꿈 금지, 강제 줄바꿈

<div style="width:가로;height:세로;overflow:hidden;white-space:nowrap;">내용</div>

 

<div style="width:가로;height:세로;overflow:hidden;word-break:break-all;">내용</div>

 

속성(Property)

속성값	값(예)	설명
normal	white-space: normal;	줄바꿈을 인식하고, 공백을 인식하지 못합니다. 기본값
nowrap	white-space: nowrap;	줄바꿈, 공백을 인식하지 못합니다. 한 줄로 정렬
pre	white-space: pre;	줄바꿈은 인식 못하고, 공백만 인식합니다.
pre-wrap	white-space: pre-wrap;	줄바꿈, 공백을 인식합니다.
pre-line	white-space: pre-line;	줄바꿈 인식하고, 공백은 앞쪽만 인식합니다.
break-spaces	white-space: break-spaces;	줄바꿈, 공백을 글자를 기준으로 인식합니다.

 

 

속성(Property)

속성값	값(예)	설명
normal	word-break: normal;	기본 줄바꿈 규칙이 적용됩니다.
keep-all	word-break: keep-all;	줄바꿈 할 때 단어를 유지하며 적용됩니다.
break-all	word-break: break-all;	CJK(중국어,일본어,한국어) 텍스트에서는 작동되지 않습니다.
break-word	word-break: break-word;	overflow-wrap: break-word 속성과 동일하기 때문에 현재는 사용하지 않습니다.

 

 

출처: https://webstoryboy.co.kr/1716 [WEBSTORYBOY:티스토리]