HTML/태그/br: 두 판 사이의 차이

시작
 
Gaon12 (토론 / 기여)
내용 보강
1번째 줄: 1번째 줄:
{{틀:html_태그}}<br/>
{{틀:HTML 태그}}


==이 태그는==
== 개요 ==
[[HTML]]에서 사용되는 태그로, 줄을 바꿔주는 태그다.
<br /> 태그는 [[HTML]] 문서에서 줄바꿈(line break)을 위해 사용되는 필수적인 태그이다. HTML 문서에서는 단순히 Enter 키를 눌러 줄바꿈을 하는 것이 인식되지 않기 때문에, 명시적으로 줄바꿈을 하고 싶을 때는 이 태그를 사용해야 한다. 이 태그는 HTML뿐만 아니라 [[미디어위키]]에서도 동일하게 사용할 수 있다.


br 태그는 따로 닫는 부분이 없으며, HTML 표현과 XHTML 표현이 조금 다르다.
== 특징 ==
=== 기본 특징 ===
br 태그의 가장 큰 특징은 다음과 같다.
* 빈 태그(empty tag)로, 닫는 태그가 존재하지 않는다.
* 단순 줄바꿈만을 위한 태그이므로, 문단 구분을 위해서는 [[p 태그]]를 사용해야 한다.
* CSS를 통한 스타일링이 불가능하다.
* [[웹 접근성]] 측면에서 과도한 사용은 권장되지 않는다.


위키 문법과 동일하게 사용 할 수 있다. 자세한 내용은 [[도움말:위키 문법/1단계#줄 바꾸기]]에서 확인하자.
=== 문법적 특징 ===
==== HTML과 XHTML의 차이 ====
HTML과 XHTML에서의 표기법이 약간 다르다는 점도 특징이다.


줄만 바꾸는 것이지 문단을 바꾸는 것은 아니다. 문단을 바꾸는 태그는 [[HTML/태그/p|<nowiki><p></p></nowiki>]]이다.
* HTML 방식
** <nowiki><br></nowiki>
** <nowiki><br></br></nowiki> (비권장)


==사용법==
* XHTML 방식
HTML 표현 방식은 다음과 같다.
** <nowiki><br/></nowiki>
** <nowiki><br /></nowiki> (공백 포함)


현대의 웹 개발에서는 XHTML 방식인 <nowiki><br/></nowiki>를 더 많이 사용하는 추세이다. 이는 XML 문법과의 호환성을 위해서이다.
== 사용법 ==
=== HTML에서의 사용 ===
가장 기본적인 사용법은 다음과 같다.
<syntaxhighlight lang="HTML">
<syntaxhighlight lang="HTML">
<br>
안녕하세요.<br/>
반갑습니다.<br/>
오늘도 좋은 하루 되세요.
</syntaxhighlight>
</syntaxhighlight>


XHTML 표현 방식은 다음과 같다.
=== 위키에서의 사용 ===
==== 일반적인 경우 ====
위키에서는 줄바꿈을 위해 다음과 같은 두 가지 방법을 사용할 수 있다:
 
1. Enter 키를 두 번 눌러 빈 줄 삽입
<syntaxhighlight lang="text">
첫 번째 줄
 
두 번째 줄
</syntaxhighlight>


<syntaxhighlight lang="HTML">
2. br 태그 사용
<br/>
<syntaxhighlight lang="text">
첫 번째 줄<br/>
두 번째 줄
</syntaxhighlight>
</syntaxhighlight>


XHTML 표현 방식은 위키문법에도 쓰이고 있는 방식이다.
일반적인 문서 작성 시에는 가독성을 위해 빈 줄 삽입 방식을 권장한다.
 
==== 표 안에서의 사용 ====
표 안에서는 br 태그를 사용하는 것이 권장된다. 빈 줄 삽입 방식을 사용하면 표의 구조가 깨질 수 있기 때문이다.
 
{| class="wikitable"
! 잘못된 예
! 올바른 예
|-
| 첫 번째 줄
 
두 번째 줄
| 첫 번째 줄<br/>두 번째 줄
|}
 
== 주의사항 ==
=== 과다 사용 시 문제점 ===
<code><br></code> 태그를 과도하게 사용하면 다음과 같은 문제가 발생할 수 있다.
* 문서의 구조가 명확하지 않아져 유지보수가 어려워진다.
* 스크린 리더 사용자들의 웹 접근성을 저해할 수 있다.
* 반응형 웹 디자인에 부적합할 수 있다.
 
=== 대체 방안 ===
많은 경우  태그 대신 다음과 같은 방법을 사용하는 것이 권장된다.
* 문단 구분이 필요할 때는 [[p 태그]] 사용
* 목록을 만들 때는 [[ul 태그]]나 [[ol 태그]] 사용
* 여백이 필요할 때는 [[CSS]]의 <code>margin</code>이나 <code>padding</code> 속성 사용
* 위키 문서 작성 시에는 가급적 빈 줄 삽입 방식 사용


==예시==
= 관련 항목 =
아래와 같이 작성했다면
* [[HTML]]
* [[p 태그]]
* [[위키 문법]]


<syntaxhighlight lang="HTML">
= 각주 =
안녕<br>
<references/>
여기는 가온 위키야!<br>
어서와 환영해~<br>
</syntaxhighlight>


이렇게 나온다.(들여쓰기는 무시하자. 강조를 위해 일부러 들여쓰기 함)
[[분류:HTML]]
:안녕<br/>
[[분류:웹 개발]]
:여기는 가온 위키야!<br/>
[[분류:위키 문법]]
:어서와 환영해~<br/>

2025년 1월 1일 (수) 22:39 판

틀:HTML 태그

개요


태그는 HTML 문서에서 줄바꿈(line break)을 위해 사용되는 필수적인 태그이다. HTML 문서에서는 단순히 Enter 키를 눌러 줄바꿈을 하는 것이 인식되지 않기 때문에, 명시적으로 줄바꿈을 하고 싶을 때는 이 태그를 사용해야 한다. 이 태그는 HTML뿐만 아니라 미디어위키에서도 동일하게 사용할 수 있다.

특징

기본 특징

br 태그의 가장 큰 특징은 다음과 같다.

  • 빈 태그(empty tag)로, 닫는 태그가 존재하지 않는다.
  • 단순 줄바꿈만을 위한 태그이므로, 문단 구분을 위해서는 p 태그를 사용해야 한다.
  • CSS를 통한 스타일링이 불가능하다.
  • 웹 접근성 측면에서 과도한 사용은 권장되지 않는다.

문법적 특징

HTML과 XHTML의 차이

HTML과 XHTML에서의 표기법이 약간 다르다는 점도 특징이다.

  • HTML 방식
    • <br>
    • <br></br> (비권장)
  • XHTML 방식
    • <br/>
    • <br /> (공백 포함)

현대의 웹 개발에서는 XHTML 방식인 <br/>를 더 많이 사용하는 추세이다. 이는 XML 문법과의 호환성을 위해서이다.

사용법

HTML에서의 사용

가장 기본적인 사용법은 다음과 같다.

안녕하세요.<br/>
반갑습니다.<br/>
오늘도 좋은 하루 되세요.

위키에서의 사용

일반적인 경우

위키에서는 줄바꿈을 위해 다음과 같은 두 가지 방법을 사용할 수 있다:

1. Enter 키를 두 번 눌러 빈 줄 삽입

첫 번째 줄

두 번째 줄

2. br 태그 사용

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

일반적인 문서 작성 시에는 가독성을 위해 빈 줄 삽입 방식을 권장한다.

표 안에서의 사용

표 안에서는 br 태그를 사용하는 것이 권장된다. 빈 줄 삽입 방식을 사용하면 표의 구조가 깨질 수 있기 때문이다.

잘못된 예 올바른 예
첫 번째 줄

두 번째 줄

첫 번째 줄
두 번째 줄

주의사항

과다 사용 시 문제점


태그를 과도하게 사용하면 다음과 같은 문제가 발생할 수 있다.

  • 문서의 구조가 명확하지 않아져 유지보수가 어려워진다.
  • 스크린 리더 사용자들의 웹 접근성을 저해할 수 있다.
  • 반응형 웹 디자인에 부적합할 수 있다.

대체 방안

많은 경우 태그 대신 다음과 같은 방법을 사용하는 것이 권장된다.

  • 문단 구분이 필요할 때는 p 태그 사용
  • 목록을 만들 때는 ul 태그ol 태그 사용
  • 여백이 필요할 때는 CSSmargin이나 padding 속성 사용
  • 위키 문서 작성 시에는 가급적 빈 줄 삽입 방식 사용

관련 항목

각주

최근 바뀜

더 보기