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(중국어,일본어,한국어) 텍스트에서는 작동되지 않습니다. |
| overflow-wrap: break-word 속성과 동일하기 때문에 현재는 사용하지 않습니다. |
출처: https://webstoryboy.co.kr/1716 [WEBSTORYBOY:티스토리]
이 게시물을
번호
분류
제목
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML
HTML