HTML <hr> 태그


예시

<hr> 태그를 사용하여 콘텐츠의 주제 변경을 정의합니다.

<h1>The Main Languages of the Web</h1>

<p>HTML is the standard markup language for creating Web pages. HTML describes the structure of a Web page, and consists of a series of elements. HTML elements tell the browser how to display the content.</p>

<hr>

<p>CSS is a language that describes how HTML elements are to be displayed on screen, paper, or in other media. CSS saves a lot of work, because it can control the layout of multiple web pages all at once.</p>

<hr>

<p>JavaScript is the programming language of HTML and the Web. JavaScript can change HTML content and attribute values. JavaScript can change CSS. JavaScript can hide and show HTML elements, and more.</p>

아래에서 더 많은 "직접 사용해 보기" 예를 살펴보세요.


정의 및 사용

태그 는 <hr>HTML 페이지에서 주제별 구분을 정의합니다(예: 주제 이동).

요소 는 <hr>HTML 페이지에서 콘텐츠를 분리(또는 변경 정의)하는 데 사용되는 수평 규칙으로 가장 자주 표시됩니다.


브라우저 지원

Element
<hr> Yes Yes Yes Yes Yes

전역 속성

<hr>태그는 HTML의 전역 속성도 지원 합니다 .


이벤트 속성

<hr>태그는 HTML의 이벤트 속성 도 지원합니다 .



더 많은 예

예시

<hr> 요소 정렬(CSS 사용):

<hr style="width:50%;text-align:left;margin-left:0">

예시

음영 처리된 <hr>(CSS 포함):

<hr style="height:2px;border-width:0;color:gray;background-color:gray">

예시

<hr> 요소의 높이 설정(CSS 사용):

<hr style="height:30px">

예시

<hr> 요소의 너비를 설정합니다(CSS 사용):

<hr style="width:50%">

관련 페이지

HTML DOM 참조: HR 개체


기본 CSS 설정

대부분의 브라우저는 <hr>다음 기본값으로 요소를 표시합니다.

예시

hr {
  display: block;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  margin-left: auto;
  margin-right: auto;
  border-style: inset;
  border-width: 1px;
}