diff options
Diffstat (limited to 'files/ko/web/html/element/hr/index.html')
| -rw-r--r-- | files/ko/web/html/element/hr/index.html | 131 |
1 files changed, 131 insertions, 0 deletions
diff --git a/files/ko/web/html/element/hr/index.html b/files/ko/web/html/element/hr/index.html new file mode 100644 index 0000000000..80163cd763 --- /dev/null +++ b/files/ko/web/html/element/hr/index.html @@ -0,0 +1,131 @@ +--- +title: <hr> +slug: Web/HTML/Element/hr +tags: + - Element + - HTML + - HTML grouping content + - Reference +translation_of: Web/HTML/Element/hr +--- +<div>{{HTMLRef}}</div> + +<p><strong>HTML <code><hr></code> 요소</strong>는 이야기 장면 전환, 구획 내 주제 변경 등, 문단 레벨 요소에서 주제의 분리를 나타냅니다.</p> + +<div>{{EmbedInteractiveExample("pages/tabbed/hr.html", "tabbed-shorter")}}</div> + + + +<p>역사적으로 <code><hr></code>은 가로줄로 표현했습니다. 시각적 브라우저에서도 가로줄로 그려질 수 있지만, 이제 시각 표현에 그치지 않고 의미를 가지게 됐습니다. 따라서 가로줄을 그리고 싶다면 적절한 CSS를 사용해야 합니다.</p> + +<table class="properties"> + <tbody> + <tr> + <th scope="row"><a href="/ko/docs/Web/Guide/HTML/%EC%BB%A8%ED%85%90%ED%8A%B8_%EC%B9%B4%ED%85%8C%EA%B3%A0%EB%A6%AC">콘텐츠 카테고리</a></th> + <td><a href="/ko/docs/Web/Guide/HTML/컨텐트_카테고리#플로우_콘텐츠">플로우 콘텐츠</a>.</td> + </tr> + <tr> + <th scope="row">가능한 콘텐츠</th> + <td>없음. {{glossary("empt element", "빈 요소")}}입니다.</td> + </tr> + <tr> + <th scope="row">태그 생략</th> + <td>여는 태그는 필수입니다. 닫는 태그는 존재해선 안됩니다.</td> + </tr> + <tr> + <th scope="row">가능한 부모 요소</th> + <td><a href="/ko/docs/Web/Guide/HTML/컨텐트_카테고리#플로우_콘텐츠">플로우 콘텐츠</a>를 허용하는 모든 요소.</td> + </tr> + <tr> + <th scope="row">가능한 ARIA 역할</th> + <td>{{ARIARole("presentation")}}</td> + </tr> + <tr> + <th scope="row">DOM 인터페이스</th> + <td>{{domxref("HTMLHRElement")}}</td> + </tr> + </tbody> +</table> + +<h2 id="특성">특성</h2> + +<p><span style="line-height: 21px;">이 요소는 </span><a href="/ko/docs/Web/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">전역 특성</a>을 포함합니다.</p> + +<dl> + <dt>{{htmlattrdef("align")}} {{deprecated_inline}}</dt> + <dd>줄의 정렬을 지정합니다. 기본값은 <code>left</code>입니다.</dd> + <dt>{{htmlattrdef("color")}} {{Non-standard_inline}}</dt> + <dd>색깔 이름 또는 16 진수의 값으로 줄의 색깔을 지정합니다.</dd> + <dt>{{htmlattrdef("noshade")}} {{deprecated_inline}}</dt> + <dd>Sets the rule to have no shading.</dd> + <dt>{{htmlattrdef("size")}} {{deprecated_inline}}</dt> + <dd>줄의 높이를 픽셀 단위로 지정합니다.</dd> + <dt>{{htmlattrdef("width")}} {{deprecated_inline}}</dt> + <dd>줄의 가로 길이를 픽셀이나 퍼센트 값으로 지정합니다.</dd> +</dl> + +<h2 id="예제">예제</h2> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html"><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> +</pre> + +<h3 id="결과">결과</h3> + +<p>{{EmbedLiveSample("예제")}}</p> + +<h2 id="Specifications" name="Specifications">명세</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('HTML WHATWG', 'semantics.html#the-hr-element', '<hr>')}}</td> + <td>{{Spec2('HTML WHATWG')}}</td> + <td>Definition of the <code><hr></code> element</td> + </tr> + <tr> + <td>{{SpecName('HTML5 W3C', 'grouping-content.html#the-hr-element', '<hr>')}}</td> + <td>{{Spec2('HTML5 W3C')}}</td> + <td></td> + </tr> + <tr> + <td>{{SpecName('HTML4.01', 'present/graphics.html#h-15.3', '<hr>')}}</td> + <td>{{Spec2('HTML4.01')}}</td> + <td>The <code>align</code>, <code>noshade</code>, <code>size</code>, and <code>width</code> attributes are deprecated</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">브라우저 호환성</h2> + + + +<p>{{Compat("html.elements.hr")}}</p> + +<h2 id="같이_보기">같이 보기</h2> + +<ul> + <li>{{htmlelement("p")}}</li> +</ul> |