HTML 텍스트 줄 바꿈

오늘 포스트에서는 HTML에서 텍스트를 줄 바꿈하는 방법을 배웁니다.

HTML의 텍스트 줄 바꿈

텍스트 편집기와 워드 프로세서에는 텍스트 줄 바꿈 또는 텍스트 흐름이라는 기능이 있습니다. 페이지의 측면에 도달하면 사용자의 텍스트가 다음 줄로 넘어갈 수 있습니다.

word-wrap 속성 덕분에 긴 단어를 분할하여 다음 줄로 묶을 수 있습니다.

통사론:

word-wrap: value

word-wrap이 지원하는 네 가지 값은 다음과 같습니다.

1. 단어 줄 바꿈 속성의 기본값은 보통이며 허용된 위치에서만 단어를 나눕니다.
2. break-word 값 덕분에 깨지지 않는 단어를 깨뜨릴 수 있습니다.
3. initial 값은 이 속성을 기본 설정으로 설정합니다.
4. inherit 값은 상위 요소에서 이 속성을 상속합니다.

이전 개념을 더 잘 이해하려면 다음 예제를 고려하십시오.

<div>
Helloooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo World!
</div>

div {
    width: 350px;
    word-wrap: break-word;
}

위의 예는 285자의 div 내에 hello world 문구를 인쇄합니다. 단어 줄 바꿈: 중단 단어; 속성은 화면의 너비가 350px를 초과할 때 다음 줄의 단어를 자동으로 분리하는 데 사용됩니다.