설명
In HTML5 the <hr> element represents a thematic break between paragraph-level elements (for example, a change of scene in a story, or a shift of topic with a section). In previous versions of HTML, it represented a horizontal rule. It may still be displayed as a horizontal rule in visual browsers, but is now defined in semantic terms, rather than presentational terms.
HTML5에서 <hr>은 단락들 사이에서 의미적인 분리 가 있을때 사용된다. (예를들어, 이야기에서 장면이 변화하거나, 주제가 새 문단과 함께 변화하였을 때). 이전버젼의 HTML에서는, 수평선으로만 표현이 되었는데 여전히 브라우져에는 수평선으로만 표시되어지지만, 보여지는 요소로 뿐만 아니라 의미적인 요소로 사용되어진다.
Usage Context
| Permitted content | None; it is a void element |
| Tag omission | It must have start tag, but must not have an end tag. |
| Permitted parent elements | Any element that accepts flow content. |
| Normative document | HTML 5, section 4.5.2; HTML 4.01, section 15.3 |
속성
이 엘리먼트는 전역속성을 지원한다.
align -- Deprecated since HTML4.01 Obsolete since HTML5
HTML4.01부터 폐지예정, HTML5부터 폐지됨.
Sets the alignment of the rule on the page. If no value is specified, the default value is left.
페이지의 정렬속성을 지정함. 아무런 값도 지정되지 않았을때는, 기본으로 왼쪽정렬됨.
color - Non-standard
표준이 아님
Sets the color of the rule through color name or hexadecimal value.
색상 이름이나 16진수로 색상 값을 지정함.
noshade - Deprecated since HTML4.01 Obsolete since HTML5
HTML4.01부터 폐지예정, HTML5부터 폐지됨.
Sets the rule to have no shading.
음영을 가지지 않도록 지정함
size - Deprecated since HTML4.01 Obsolete since HTML5
HTML4.01 부터 폐지예정, HTML5부터 폐지됨.
Sets the height, in pixels, of the rule.
높이를 pixel단위로 지정함
width - Deprecated since HTML4.01 Obsolete since HTML5
HTML4.01부터 폐지예정, HTML5부터 폐지됨.
Sets the length of the rule on the page through a pixel or percentage value.
페이지에 표시될 가로 길이를 픽셀이나 퍼센트로 지정함.
예제
<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> <p> 첫 문단의 텍스트 입니다.</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> <p> 두번째 문단의 텍스트입니다 </p>
Above HTML will output:
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.
위의 HTML은 다음과 같은 결과를 만든다.
첫 문단의 텍스트 입니다. 첫 문단의 텍스트입니다. 첫 문단의 텍스트입니다. 첫 문단의 텍스트입니다.
두번째 문단의 텍스트입니다. 두번째 문단의 텍스트입니다. 두번째 문단의 텍스트입니다 두번째 문단의 텍스트입니다.
DOM Interface
To change look of rule or gaps between it and paragraphs, use cascading style sheets
보여지는 속성을 바꾸거나, 문단들 사이의 간격을 바꾸기 위해서는 CSS 를 사용해야한다.
호환성
| 기능 | 구글크롬 | 파이어폭스Gecko) | 인터넷 익스플로러 | Opera | Safari |
|---|---|---|---|---|---|
| 기본적인 지원 | 1.0 | 지원 | 지원 | 지원 |
| 기능 | 안드로이드 | 파이어폭스 모바일(Gecko) | 인터넷 익스플로러 모바일 | 오페라 모바일 | 사파리 모바일 |
|---|---|---|---|---|---|
| 기본적인 지원 | 지원 | 지원 | 지원 | 지원 | 지원 |
