<hr>

HTML <hr> 요소는 문단 레벨 요소들 사이에서 주제의 분리를 나타냅니다. (예를 들면, 이야기의 장면이 변경되거나 구획에서 화제가 전환될떄). 이전 버전의 HTML에서 이 요소는 수평선을 나타냈습니다. 지금도 여전히 브라우저에서 수평선을 표시하지만, 표현상 관점보다는 시멘틱 관점을 정의합니다.

속성

이 요소는 전역 속성을 포함합니다.

alignDeprecated HTML4.01안씀 HTML5
Sets the alignment of the rule on the page. If no value is specified, the default value is left.
color
색깔 이름 또는 16 진수의 값으로 줄의 색깔을 지정합니다.
noshadeDeprecated HTML4.01안씀 HTML5
Sets the rule to have no shading.
sizeDeprecated HTML4.01안씀 HTML5
줄의 높이를 픽셀 단위로 지정합니다.
widthDeprecated HTML4.01안씀 HTML5
줄의 가로 길이를 픽셀이나 퍼센트 값으로 지정합니다.

예제

<p>
This is the first paragraph of text. 
This is the first paragraph of text.
This is the first paragraph of text. 
This is the first paragraph of text.
</p>

<hr>

<p>
This is second paragraph of text. 
This is second paragraph of text.
This is second paragraph of text. 
This is second paragraph of text.
</p>

위 HTML의 결과:

This is the first paragraph of text. This is the first paragraph of text. This is the first paragraph of text. This is the first paragraph of text.


This is second paragraph of text. This is second paragraph of text. This is second paragraph of text. This is second paragraph of text.

참고

To change look of rule or gaps between it and paragraphs, use cascading style sheets.

사양

사양 상태 주석
HTML Living Standard
The definition of '<hr>' in that specification.
Living Standard hr 요소의 정의
HTML Living Standard Living Standard hr 요소의 기본 렌더링을 제안
HTML5
The definition of '<hr>' in that specification.
Recommendation  
HTML 4.01 Specification
The definition of '<hr>' in that specification.
Recommendation  

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
hrChrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
align
DeprecatedNon-standard
Chrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
color
DeprecatedNon-standard
Chrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
noshade
DeprecatedNon-standard
Chrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
size
DeprecatedNon-standard
Chrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes
width
DeprecatedNon-standard
Chrome Full support YesEdge Full support YesFirefox Full support 1IE Full support YesOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support Yes

Legend

Full support  
Full support
Non-standard. Expect poor cross-browser support.
Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.

같이 보기