CSS border 스타일

border 스타일

h1 { border-style: solid }
h1 { border-style: double }
h1 { border-style: groove }

solid 스타일

double 스타일

groove 스타일

dotted 스타일

dashed 스타일

ridge 스타일

inset 스타일

outset 스타일

border top

h1 { border-top: solid pink}

위쪽에 선을 긋는다.

border bottom

h1 { border-bottom: solid pink}

아래쪽에 선을 긋는다.

border left

h1 { border-left: solid pink}

왼쪽에 선을 긋는다.

border right

h1 { border-right: solid pink}

오른쪽에 선을 긋는다.

border 방향별 스타일

border-방향-style : border-스타일

예를 들어, top 방향 스타일을 dotted로 하고 싶으면,
h1 {border-top-style : dotted}

right 방향에 스타일을 지정하고 싶으면,
h1 { border-right-style : dotted}

top dotted 스타일

bottom dashed 스타일

left groove 스타일

right outset 스타일

border 굵기

h1 { border-style: dashed; border-width: 5px}

폭 5px 의 선이 생긴다

border 색깔

h1 { border-style: dashed; border-color: red}

색깔을 지정할 수 있다