정보

HTML 줄바꿈 하는 방법 알아보기

bling7004 2024. 2. 19. 12:50

HTML에서 줄바꿈을 하기 위해서는 다음과 같은 방법들이 있습니다.

1. <br> 태그 사용하기

<br> 태그는 줄바꿈을 위해 가장 많이 사용되는 태그 중 하나입니다. 이 태그를 사용하면 현재 위치에서 다음 줄로 넘어갑니다.

예시:

```

<p>첫 번째 줄<br>두 번째 줄</p>

```

 

결과:

첫 번째 줄

두 번째 줄

300x250

2. <p> 태그 사용하기

<p> 태그는 단락을 나누는 태그이지만, 기본적으로 앞뒤로 줄바꿈이 적용됩니다.

예시:

```

<p>첫 번째 줄</p>

<p>두 번째 줄</p>

```

결과:

첫 번째 줄

두 번째 줄

반응형

3. CSS 속성 사용하기

CSS에서는 white-space 속성을 이용하여 줄바꿈을 조절할 수 있습니다.

예시:

```

<p style="white-space: pre-line;">첫 번째 줄

두 번째 줄</p>

```

결과:

첫 번째 줄

두 번째 줄

 

위와 같은 방법들을 이용하여 HTML에서 줄바꿈을 적용할 수 있습니다.

1. <br> 태그 사용하기

가장 간단하고 일반적인 방법으로, 줄바꿈을 하고 싶은 위치에 <br> 태그를 삽입하면 됩니다. 예를 들어, "안녕하세요.<br>반갑습니다."와 같이 작성하면 "안녕하세요."와 "반갑습니다."가 각각 다른 줄에 출력됩니다.

2. <p> 태그 사용하기

<p> 태그는 단락을 나누는 태그이지만, 기본적으로 단락 사이에는 줄바꿈이 적용됩니다. 따라서, 여러 줄의 텍스트를 작성할 때 <p> 태그를 사용하면 줄바꿈이 자연스럽게 적용됩니다.

3. CSS의 white-space 속성 사용하기

CSS의 white-space 속성을 이용하면 줄바꿈을 자유롭게 조절할 수 있습니다. 예를 들어, white-space: pre; 속성을 적용하면 HTML 코드 상에서 줄바꿈을 입력한 위치 그대로 출력됩니다.

위의 방법들 중에서 적절한 방법을 선택하여 HTML에서 줄바꿈을 자유롭게 활용해보세요.

출처
https://blog.naver.com/rkd8776/223093812509
300x250
반응형