개발/CSS

hr 태그 - 수평선 / 문단 나누는 선 넣기

알 수 없는 사용자 2021. 1. 3.
반응형

hr 태그는 문단을 나눌 때 사용하는 수평선 태그입니다.

사용 방법은 간단하며 다양한 속성으로 스타일을 줄 수 있습니다.

 

<hr> 태그를 넣으면 기본 수평선이 추가됩니다.

아래와 같은 3가지 방법으로 스타일 추가가 가능합니다.

// 사용법 1
<hr style="스타일 추가">

// 사용법 2
<hr class="클래스명">

css 추가
.클래스명{
  스타일
}

// 사용법 3
css 설정
hr{
  스타일
}

스타일 속성

width 가로 값. width: 가로크기 로 사용
height 세로 값. height: 세로크기 로 사용
border 선 속성. border: 선종류 선크기 선색깔 로 사용
text-align 정렬 설정. ie만 지원하며 text-align: 정렬위치 로 사용
margin-left 왼쪽 정렬. 크롬/파이어폭스용
margin-right 오른쪽 정렬. 크롬/파이어폭스용

 

아래 예제의 다양한 사용법을 보시고 필요에 맞게 사용하세요.

 

 

See the Pen hr 예제 by jess (@jess44) on CodePen.

반응형

댓글

💲 추천 글