lesson1Title

lesson2Title

lesson3Title

lesson4Title

lesson5Title

lesson6Title

lesson7Title

lesson8Title

lesson9Title

lesson10Title

lesson11Title

lesson12Title

webIntroHtmlChapter2Title

webIntroHtmlChapter1Title

webIntroHtmlChapter3Title

webIntroHtmlChapter4Title

<!DOCTYPE html>
<html lang="ko">
 <head>
 <meta charset="UTF-8" />
 <meta name="viewport" content="width=device-width, initial-scale=1.0" />
 <link
 href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR"
 rel="stylesheet"
 />
 <title>br & hr 태그 예시</title>
 <style>
 hr {
 border: 1px solid #ccc;
 margin: 20px 0;
 }
 </style>
 </head>

 <body>
 <h2>br 태그 예시</h2>
 
 나는 코딩한다 
 고로 존재한다 
 - 코드프렌즈 -
 

 <hr />

 <h2>hr 태그 예시</h2>
 첫 번째 섹션의 내용입니다. 여러분과 함께하는 시간이 정말 소중해요.

 <hr />

 
 두 번째 섹션의 내용입니다. 이곳에서는 다른 주제로 이야기를 나누려고 해요.
 
 </body>
</html>

# br, hr 태그

br 태그는 웹 페이지에 줄바꿈(line-break)을, hr 태그는 수평선을 만듭니다.

 

## 1. ` ` 태그

- ` ` 태그는 "Break"의 약자로, 웹 페이지에 줄바꿈을 만듭니다. 예를 들어 시와 같은 텍스트를 입력할 때, 각 구절을 새로운 줄에서 시작하게 하려면 ` `을 사용합니다.

- ` ` 태그는 텍스트 편집 시 'Enter' 키를 누르는 것과 같습니다.

 

### br 태그 사용 예시

```html title="br 태그 예시"
첫 번째 줄 두 번째 줄
```

 

### 주의사항

` ` 태그는 닫는 태그가 없습니다. 문서에서 줄을 바꾸고 싶은 곳에 ` ` 또는 ` `을 삽입하면 됩니다.

` `과 ` `은 동일한 태그이지만, HTML5에서는 ` `을 사용하는 것을 권장합니다.

 

## 2. `<hr>` 태그

- `<hr>` 태그는 "Horizontal Rule"의 약자로, 웹 페이지에 수평선을 만듭니다. 주로 내용이 바뀌는 지점이나 다른 섹션으로 넘어갈 때 영역을 시각적으로 구분합니다.

 

### 예시

```html title="hr 태그 예시"
단락 1
<hr />
단락 2
```

 

### 주의사항

`<hr>` 태그도 ` ` 태그처럼 닫는 태그가 없으며, CSS로 선의 굵기나 색상을 변경할 수 있습니다.

웹 페이지에서 줄을 바꾸고 싶을 때는 ` ` 태그를 사용합니다. 이 태그는 'Enter' 키를 누르는 것과 같은 역할을 하며, 닫는 태그가 필요 없습니다.

### 다음 중 웹 페이지에서 줄바꿈을 만드는 HTML 태그는 무엇인가요?

br, hr 태그

1. <br> 태그

br 태그 사용 예시

주의사항

2. <hr> 태그

예시

주의사항

다음 중 웹 페이지에서 줄바꿈을 만드는 HTML 태그는 무엇인가요?

1. `<br>` 태그

2. `<hr>` 태그