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뿐만 아니라 미디어위키에서도 동일하게 사용할 수 있다.

특징[편집 / 원본 편집]

기본 특징[편집 / 원본 편집]

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

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

문법적 특징[편집 / 원본 편집]

HTML과 XHTML의 차이[편집 / 원본 편집]

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

HTML 방식
- 
- (비권장)

XHTML 방식
- 
- (공백 포함)

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

사용법[편집 / 원본 편집]

HTML에서의 사용[편집 / 원본 편집]

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

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

위키에서의 사용[편집 / 원본 편집]

일반적인 경우[편집 / 원본 편집]

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

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

첫 번째 줄

두 번째 줄

2. br 태그 사용

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

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

표 안에서의 사용[편집 / 원본 편집]

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

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

주의사항[편집 / 원본 편집]

과다 사용 시 문제점[편집 / 원본 편집]

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

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

대체 방안[편집 / 원본 편집]

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

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

각주[편집 / 원본 편집]

HTML/태그/br

목차