시작 |
틀 이름 오타 수정 |
||
| (같은 사용자의 중간 판 하나는 보이지 않습니다) | |||
| 1번째 줄: | 1번째 줄: | ||
{{틀:html_태그}} | {{틀:html_태그}} | ||
== | == 개요 == | ||
[[HTML]] | <br /> 태그는 [[HTML]] 문서에서 줄바꿈(line break)을 위해 사용되는 필수적인 태그이다. HTML 문서에서는 단순히 Enter 키를 눌러 줄바꿈을 하는 것이 인식되지 않기 때문에, 명시적으로 줄바꿈을 하고 싶을 때는 이 태그를 사용해야 한다. 이 태그는 HTML뿐만 아니라 [[미디어위키]]에서도 동일하게 사용할 수 있다. | ||
br | == 특징 == | ||
=== 기본 특징 === | |||
br 태그의 가장 큰 특징은 다음과 같다. | |||
* 빈 태그(empty tag)로, 닫는 태그가 존재하지 않는다. | |||
* 단순 줄바꿈만을 위한 태그이므로, 문단 구분을 위해서는 [[p 태그]]를 사용해야 한다. | |||
* CSS를 통한 스타일링이 불가능하다. | |||
* [[웹 접근성]] 측면에서 과도한 사용은 권장되지 않는다. | |||
=== 문법적 특징 === | |||
==== HTML과 XHTML의 차이 ==== | |||
HTML과 XHTML에서의 표기법이 약간 다르다는 점도 특징이다. | |||
* HTML 방식 | |||
** <nowiki><br></nowiki> | |||
** <nowiki><br></br></nowiki> (비권장) | |||
* XHTML 방식 | |||
** <nowiki><br/></nowiki> | |||
** <nowiki><br /></nowiki> (공백 포함) | |||
현대의 웹 개발에서는 XHTML 방식인 <nowiki><br/></nowiki>를 더 많이 사용하는 추세이다. 이는 XML 문법과의 호환성을 위해서이다. | |||
== 사용법 == | |||
=== HTML에서의 사용 === | |||
가장 기본적인 사용법은 다음과 같다. | |||
<syntaxhighlight lang="HTML"> | <syntaxhighlight lang="HTML"> | ||
<br> | 안녕하세요.<br/> | ||
반갑습니다.<br/> | |||
오늘도 좋은 하루 되세요. | |||
</syntaxhighlight> | </syntaxhighlight> | ||
=== 위키에서의 사용 === | |||
==== 일반적인 경우 ==== | |||
위키에서는 줄바꿈을 위해 다음과 같은 두 가지 방법을 사용할 수 있다: | |||
1. Enter 키를 두 번 눌러 빈 줄 삽입 | |||
<syntaxhighlight lang="text"> | |||
첫 번째 줄 | |||
두 번째 줄 | |||
</syntaxhighlight> | |||
<syntaxhighlight lang=" | 2. br 태그 사용 | ||
<br/> | <syntaxhighlight lang="text"> | ||
첫 번째 줄<br/> | |||
두 번째 줄 | |||
</syntaxhighlight> | </syntaxhighlight> | ||
일반적인 문서 작성 시에는 가독성을 위해 빈 줄 삽입 방식을 권장한다. | |||
==== 표 안에서의 사용 ==== | |||
표 안에서는 br 태그를 사용하는 것이 권장된다. 빈 줄 삽입 방식을 사용하면 표의 구조가 깨질 수 있기 때문이다. | |||
{| class="wikitable" | |||
! 잘못된 예 | |||
! 올바른 예 | |||
|- | |||
| 첫 번째 줄 | |||
두 번째 줄 | |||
| 첫 번째 줄<br/>두 번째 줄 | |||
|} | |||
== 주의사항 == | |||
=== 과다 사용 시 문제점 === | |||
<code><br></code> 태그를 과도하게 사용하면 다음과 같은 문제가 발생할 수 있다. | |||
* 문서의 구조가 명확하지 않아져 유지보수가 어려워진다. | |||
* 스크린 리더 사용자들의 웹 접근성을 저해할 수 있다. | |||
* 반응형 웹 디자인에 부적합할 수 있다. | |||
=== 대체 방안 === | |||
많은 경우 태그 대신 다음과 같은 방법을 사용하는 것이 권장된다. | |||
* 문단 구분이 필요할 때는 [[p 태그]] 사용 | |||
* 목록을 만들 때는 [[ul 태그]]나 [[ol 태그]] 사용 | |||
* 여백이 필요할 때는 [[CSS]]의 <code>margin</code>이나 <code>padding</code> 속성 사용 | |||
* 위키 문서 작성 시에는 가급적 빈 줄 삽입 방식 사용 | |||
== | = 관련 항목 = | ||
* [[HTML]] | |||
* [[p 태그]] | |||
* [[위키 문법]] | |||
= 각주 = | |||
<references/> | |||
</ | |||
[[분류:HTML]] | |||
: | [[분류:웹 개발]] | ||
: | [[분류:위키 문법]] | ||
: | |||
2025년 1월 1일 (수) 22:40 기준 최신판
| |||||
| HTML의 주요 태그 목록 | |||||
|---|---|---|---|---|---|
| 분류 | 관련 태그 | ||||
| 문서 기본 구조 | <html> | <head> | <body> | <main> | <footer> |
| 메타데이터 | <title> | <meta> | <base> | <link> | |
| 콘텐츠 구획 | <header> | <nav> | <section> | <article> | <aside> |
| 텍스트 콘텐츠 | <h1>-<h6> | <p> | <div> | <span> | <pre> |
| 텍스트 형식 | <b> / <strong> | <i> / <em> | <small> | <sub> / <sup> | <mark> |
| 수정 표시 | <ins> | <del> | <s> | <u> | |
| 목록 | <ul> | <ol> | <li> | <dl> | <dt> / <dd> |
| 표 | <table> | <thead> / <tbody> | <tr> | <th> | <td> |
| 멀티미디어 | <img> | <audio> | <video> | <canvas> | <svg> |
| 임베드 | <iframe> | <embed> | <object> | <param> | |
| 스크립트 | <script> | <noscript> | <template> | <slot> | |
| 양식 | <form> | <input> | <button> | <select> / <option> | <textarea> |
| 구분선 | <br> | <hr> | |||
개요[편집 / 원본 편집]
태그는 HTML 문서에서 줄바꿈(line break)을 위해 사용되는 필수적인 태그이다. HTML 문서에서는 단순히 Enter 키를 눌러 줄바꿈을 하는 것이 인식되지 않기 때문에, 명시적으로 줄바꿈을 하고 싶을 때는 이 태그를 사용해야 한다. 이 태그는 HTML뿐만 아니라 미디어위키에서도 동일하게 사용할 수 있다.
특징[편집 / 원본 편집]
사용법[편집 / 원본 편집]
HTML에서의 사용[편집 / 원본 편집]
가장 기본적인 사용법은 다음과 같다.
안녕하세요.<br/>
반갑습니다.<br/>
오늘도 좋은 하루 되세요.위키에서의 사용[편집 / 원본 편집]
주의사항[편집 / 원본 편집]
과다 사용 시 문제점[편집 / 원본 편집]
- 문서의 구조가 명확하지 않아져 유지보수가 어려워진다.
- 스크린 리더 사용자들의 웹 접근성을 저해할 수 있다.
- 반응형 웹 디자인에 부적합할 수 있다.