[잡담] 인장을 테두리로 꾸미기

<div style="여기에 이 글에서 배운 내용을 쓰시면 됩니다.">내용</div>

border-style

border-width

border-color

border-style은 말 그대로 테두리의 스타일을 설정하는 겁니다.

border-style에는 다음과 같은 값을 설정할 수 있습니다.

dotted: Defines a dotted border

dashed: Defines a dashed border

solid: Defines a solid border

double: Defines two borders. The width of the two borders are the same as the border-width value

groove: Defines a 3D grooved border. The effect depends on the border-color value

ridge: Defines a 3D ridged border. The effect depends on the border-color value

inset: Defines a 3D inset border. The effect depends on the border-color value

outset: Defines a 3D outset border. The effect depends on the border-color value

(출처 : http://www.w3schools.com/css/css_border.asp)

dotted

dashed

solid

double

groove

ridge

inset

outset

중에 하나를 입력하시면 됩니다.

border-width는 테두리의 두께입니다.

1px이나 2px정도가 적당합니다.

border-color는 테두리 색을 지정합니다.

border-color: red

border-color: #F00;

이런식으로 하시면 됩니다.

위 내용을 따로따로 할 필요없이

border 하나로 할 수 있습니다.

border: width style color

border: 1px solid black

이런식으로 쓸 수 있습니다.