HTML
줄바꿈 금지, 강제 줄바꿈
<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:티스토리]

이 게시물을

공유하기

SEARCH

MENU NAVIGATION