HTML 속성(HTML attribute) 또는 하이퍼텍스트 마크업 언어 속성(Hypertext markup language attributes)은 HTML 요소의 동작이나 표시를 조정하는 데 사용되는 특별한 단어다. 속성은 요소 유형의 기본 기능을 수정하거나, 속성 없이는 올바르게 작동할 수 없는 특정 요소 유형에 기능을 제공한다. HTML 구문에서 속성은 HTML 시작 태그에 추가된다.

다음과 같은 몇 가지 기본 속성 유형이 확인되었다: (1) 특정 요소 유형이 올바르게 작동하기 위해 필요한 필수 속성; (2) 요소 유형의 기본 기능을 수정하는 데 사용되는 선택적 속성; (3) 많은 요소 유형에서 지원되는 표준 속성; (4) 특정 상황에서 실행될 스크립트를 지정하기 위해 요소 유형에 사용되는 이벤트 속성.

Doctype HTML은 브라우저에 문서가 어떤 버전의 HTML로 작성되었는지 알려주는 선언이다.

일부 속성 유형은 다른 요소 유형을 수정할 때 다르게 작동한다. 예를 들어, 속성 name은 여러 요소 유형에서 사용되지만 각 요소에서 약간씩 다른 기능을 수행한다.^[1]

HTML 속성은 일반적으로 =로 구분된 이름-값 쌍으로 나타나며, 요소의 이름 뒤에 요소의 시작 태그 내에 작성된다.

<element attribute="value">element content</element>

여기서 element는 HTML 요소 유형의 이름을 나타내고, attribute는 제공된 value(값)로 설정된 속성의 이름이다. 값은 작은따옴표나 큰따옴표로 묶을 수 있지만, 특정 문자로 구성된 값은 HTML에서 따옴표 없이 남겨둘 수 있다(단, XHTML에서는 불가능하다).^[2][3] 속성 값을 따옴표 없이 남겨두는 것은 안전하지 않은 것으로 간주된다.^[4]

대부분의 속성은 쌍을 이루는 이름과 값으로 제공되지만, 일부 속성은 요소의 시작 태그에 존재하는 것만으로 요소에 영향을 미치기도 한다^[5] (img 요소의 ismap 속성처럼 말이다^[6]).

약어 요소인 abbr을 사용하여 이러한 다양한 속성을 보여줄 수 있다.

<abbr id="anId" class="aClass" style="color:blue;" title="Hypertext Markup Language">HTML</abbr>

이 예시는 링크가 아니면서 파란색으로 표시된 HTML로 표시되며, 대부분의 브라우저에서 약어에 커서를 올리면 노란색 배경이 떠 있는 형태(말풍선) 내에 제목 텍스트 "Hypertext Markup Language"가 표시된다.

<div style="text-align: center;">Centered text</div>

또 다른 예시에서 텍스트는 다음과 같이 표시된다.

대부분의 요소는 언어 관련 속성인 lang과 dir도 가질 수 있다.

일반적으로 HTML 요소는 다음과 같은 몇 가지 가장 일반적인 표준 속성을 가질 수 있다(전체 목록 보기):

• id 속성은 요소에 대해 문서 전체에서 고유한 식별자를 제공한다.^[7][8][9] 이는 프레젠테이션 속성을 제공하기 위한 CSS 선택자로 사용되거나, 브라우저가 특정 요소에 주의를 집중하도록 하거나, 스크립트가 요소의 내용이나 프레젠테이션을 변경하는 데 사용될 수 있다. 페이지의 URL 끝에 추가되면, URL은 문서 내의 특정 요소(일반적으로 페이지의 하위 섹션)를 직접 가리킨다. 예를 들어, http://en.wikipedia.org/wiki/HTML#Attributes에서 ID "Attributes"는 "HTML" 페이지의 "Attributes" 섹션을 나타낸다.
• class 속성은 유사한 요소를 분류하는 방법을 제공한다. 공백으로 구분하여 여러 클래스 이름을 추가할 수 있다.^[10][11] 의미론적으로 예를 들어 클래스는 마이크로포맷에서 사용된다. 또한 스타일 시트 작성자는 스타일링 목적으로 클래스별로 요소와 일치하는 선택자를 구성할 수 있다. 예를 들어, HTML 문서는 class="notation"이라는 지정을 사용하여 이 클래스 값을 가진 모든 요소가 문서의 본문에 종속됨을 나타낼 수 있다. 이러한 요소는 HTML 소스 내의 위치가 제안하는 위치에 나타나는 대신 페이지의 각주로 모일 수 있다. 스타일 시트 작성자는 .notation 선택자로 규칙을 정의하고 font-size: small; 속성을 정의할 수도 있다.
• style 속성은 요소별 스타일 규칙을 적용하는 방법을 제공한다. 세미콜론과 선택적 공백으로 구분하여 여러 스타일 선언을 추가할 수 있으며, 각 선언에는 콜론과 선택적 공백으로 구분된 CSS 속성 이름과 값이 포함된다(예: style="color: red; text-align: center;").^[12][13][14] style 속성은 모든 HTML 요소에서 사용할 수 있다(모든 HTML 요소에서 유효성 검사를 통과하지만 반드시 유용한 것은 아니다). 스타일 정보를 스타일 시트에 추가하는 것이 더 좋은 관행으로 간주되며, 이는 종종 요소 클래스나 ID와 일치하는 선택자로 수행된다. 그러나 단순하고 구체적이거나 임시 스타일 사양의 경우 스타일 시트가 너무 번거롭다고 간주될 때 인라인 스타일이 선호되기도 한다.
• title 속성은 요소에 부차적인 텍스트 설명을 첨부하는 데 사용된다. 대부분의 브라우저에서 이 속성은 흔히 말풍선이라고 불리는 형태로 표시된다.

HTML 속성은 일반적으로 필수 속성, 선택적 속성, 표준 속성, 이벤트 속성으로 분류된다.

• 일반적으로 필수 및 선택적 속성은 특정 HTML 요소를 수정한다.
• 반면 표준 속성은 대부분의 HTML 요소에 적용될 수 있다.^[15]
• HTML 버전 4에서 추가된 이벤트 속성을 사용하면 특정 상황에서 실행될 스크립트를 요소가 지정할 수 있다.^[16] 스크립트는 HTML 솔루션에 입력할 수 있는 것이다. HTML 스크립트는 수감자들이 알고 있는 용도다.
• HTML 스크립트는 기억할 수 있는 것이다.
• 때때로 HTML은 소스용으로 이해 가능하다.

• <a> 및 <area>:
  • coords — 그 내부의 <area> 또는 <link>의 좌표.
  • shape — 그 내부의 <area> 또는 <link>의 모양. 값: default, rect, circle, poly.
• <a> 및 <link>:
  • hreflang — 연결된 문서의 언어 코드. (<a>, <link>)
  • rel — 연결된 문서의 성격 (현재 표시된 페이지와의 관계). <a>의 경우 자유 텍스트이지만, <link>은 용어 세트(alternate, appendix, bookmark, chapter, contents, copyright, glossary, help, home, index, next, prev, section, start, stylesheet, subsection)를 사용한다.
  • rev — 현재 표시된 페이지의 성격 (연결된 문서와의 관계). rel과 마찬가지로 <a> 및 <link>에 따라 다르다.
• <applet> 및 <object>:
  • archive — 아카이브 URL(들) (<applet>, <object>)
  • codebase — 베이스 URL (<applet>, <object>)
• <basefont> 및 <font>:
  • color — 텍스트 색상 (사용 중단됨) (<basefont>, <font>)
  • face — 글꼴 패밀리 (사용 중단됨) (<basefont>, <font>)
• <col> 및 <colgroup>:
  • span — 걸쳐 있는 열의 수 (<col>, <colgroup>)
• <del> 및 <ins>:
  • datetime — 텍스트 deletion 또는 insertion 날짜와 시간.
• <form> 및 <input>:
  • accept — <form> 또는 <input> 업로드 시 허용되는 파일 유형
• <frame> 및 <iframe>:
  • frameborder — 값 (0 또는 1)은 <frame> 또는 <iframe> 주위에 테두리를 표시할지 여부를 지정한다.
  • marginheight — <frame> 또는 <iframe> 주위의 상단 및 하단 여백(픽셀 단위).
  • scrolling — 값 (yes, no, auto)은 <frame> 또는 <iframe> 주위에 스크롤 바를 표시할지 여부를 지정한다.
  • marginwidth — <frame> 또는 <iframe> 주위의 좌측 및 우측 여백(픽셀 단위).
• <frameset> 및 <textarea>:
  • cols — <frameset> 또는 <textarea>의 보이는 열 수 (일부 변형 있음)
  • rows — <frameset> 또는 <textarea>의 보이는 행 수 (일부 변형 있음)
• <img> 및 <object>:
  • usemap — <img>과 함께 사용할 map 요소의 이름을 지정하거나 <object>과 함께 사용할 이미지 맵의 URL을 지정한다.
• <input> 및 <textarea>:
  • readonly — <input> 및 <textarea>에 대해 읽기 전용 텍스트를 지정한다.
• <link> 및 <style>:
  • media — <link> 및 <style>에 대해 디스플레이 장치를 지정한다. 값: all, aural, braille, handheld, print, projection, screen, tty, TV.
• <optgroup> 및 <option>:
  • label — <optgroup> 또는 <option>에 대한 설명 텍스트.
• <td> 및 <th>:
  • abbr — 표 cell 또는 header의 약어 버전.
  • axis — 표 cell 또는 header의 카테고리 이름.
  • colspan — 표 cell 또는 header가 차지하는 열 수.
  • nowrap — (사용 중단됨) 표 cell 또는 header의 줄 바꿈을 방지한다.
  • rowspan — 표 cell 또는 header가 차지하는 행 수.
  • scope — 일반 브라우저 표시에는 영향을 미치지 않지만 표 cell 또는 header를 다른 셀에 대한 논리적 헤더로 표시한다. 값: col, colgroup, row, rowgroup.

• align — <applet>, <col>, <colgroup>, <object>, <tbody>, <td>, <tfoot>, <th>, <thead>

• align은 다음에서도 사용 중단됨: <caption>, <div>, <h1> ~ <h6>, <hr>, <iframe>, <img>, <input>, <legend>, <p>, <table>

• alt — <applet>, <area>, <img>, <input>
• bgcolor — <body>, <table>, <td>, <th>, <bgcolor>
• border — <img>, <object>, <table>
• char — <char>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr>
• charoff — <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr>
• charset — <a>, <link>, <script>
• cite — <blockquote>, <del>, <ins>, <q>
• compact — <dir>, <menu>, <ol>, <ul>
• disabled — <button>, <input>, <optgroup>, <option>, <select>, <textarea>
• height — <applet>, <iframe>, <img>, <object>. 또한 다음에서 사용 중단됨: <td>, <th>
• href — <a>, <area>, <base>, <link>
• hspace — <applet>, <object>. 또한 다음에서 사용 중단됨: <img>
• longdesc — <frame>, <iframe>, <img>
• name — <a>, <applet>, <button>, <form>, <frame>, <iframe>, <input>, <map>, <meta>, <object>, <param>, <select>, <textarea>
• size — <basefont>, <font>, <hr>, <input>, <select>
• src — <frame>, <iframe>, <img>, <input>, <script>
• target — <a>, <area>, <base>, <form>, <link>
• type — <button>, <input>, <li>, <link>, <object>, <ol>, <param>, <script>, <style>, <ul>
• valign — <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead>, <tr>
• value — <button>, <input>, <li>, <option>, <param>
• vspace — <applet>, <img>, <object>
• width — <applet>, <col>, <colgroup>, <hr>, <iframe>, <img>, <object>, <pre>, <table>, <td>, <th>

표준 속성은 전역 속성으로도 알려져 있으며, 수많은 요소와 함께 작동한다.^[17] 여기에는 기본 표준 속성인 accesskey, class, contenteditable, contextmenu, data, dir, hidden, id, lang, style, tabindex, title 등이 포함된다. 실험적인 것들도 있다. xml:lang과 xml:base는 모두 사용 중단되었다. 여러 aria-* 속성은 접근성을 개선한다.^[17] 이벤트 핸들러 속성은 나중에 나열된다.

기술적으로 모든 표준 속성은 모든 요소에서 수락되어야 하지만, 일부 요소에서는 작동하지 않을 수 있다.^[18] 아래 표는 몇 가지 공통 표준 속성과 이들이 작동할 수 있는 일부 요소를 나열한다.

요소	id	class	style	title	dir	lang	xml:lang	accesskey	tabindex
<param>
<head>
<html>
<meta>
<title>
<style>
<applet>
<br>
<frame>
<frameset>
<iframe>
<basefont>
<center>
<dir>
<font>
<menu>
<s>
<strike>
<u>
<abbr>
<acronym>
<address>
<b>
<big>
<blockquote>
<body>
<caption>
<cite>
<code>
<col>
<colgroup>
<dd>
<del>
<dfn>
<div>
<dl>
<dt>
<em>
<fieldset>
<form>
<hr>
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
<i>
<img>
<ins>
<kbd>
<li>
<link>
<map>
<noframes>
<noscript>
<ol>
<optgroup>
<option>
<p>
<pre>
<q>
<samp>
<small>
<span>
<strong>
<sub>
<sup>
<table>
<tbody>
<td>
<tfoot>
<th>
<thead>
<tr>
<tt>
<ul>
<var>
<label>
<legend>
<object>
<select>
<a>
<area>
<button>
<input>
<textarea>

표준 속성에는 이벤트 핸들러 속성이 포함된다. 이들은 모두 on- 접두사가 붙는다.^[17]

HTML 버전 4에서 추가된 이벤트 속성을 사용하면 특정 상황에서 실행될 스크립트를 요소가 지정할 수 있다. 아래 표는 몇 가지 공통 이벤트 핸들러 속성과 이들이 작동할 수 있는 일부 요소를 나열한다.

요소	onload	onunload	onabort	onclick	ondblclick	onmousedown	onmousemove	onmouseout	onmouseover	onmouseup	onkeydown	onkeypress	onkeyup	onblur	onfocus	onchange	onselect
<frameset>
<body>
<abbr>
<acronym>
<address>
<b>
<big>
<blockquote>
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<dd>
<del>
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<fieldset>
<h1>, <h2>, <h3>, <h4>, <h5>, <h6>
<hr>
<i>
<ins>
<kbd>
<legend>
<li>
<link>
<map>
<menu>
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<p>
<pre>
<q>
<s>
<samp>
<small>
<span>
<strike>
<strong>
<sub>
<sup>
<table>
<tbody>
<td>
<tfoot>
<th>
<thead>
<tr>
<tt>
<u>
<ul>
<var>
<img>
<a>
<area>
<button>
<form>
<label>
<select>
<input>
<textarea>

• HTML 요소