지토의 개발일기/html + CSS
[HTML + CSS] 테두리 속성
지아토
2021. 10. 1. 11:08
1. border-width 속성 , border-style 속성
border-width 속성의 경우 테두리의 너비를 지정하는 스타일 속성이다.
border-style 속성은 테두리의 형태를 지정하는 속성이다.
테두리를 넣을 때 둘다 사용하는 것이 좋다.
See the Pen by yeojinho (@yeojinho) on CodePen.
위의 예시는 .box에 대한 테두리 속성을 직접 다 입력했지만 이를 한번에 작성 가능합니다.
<style>
.box {
border: thick dashed black;
}
</style>
또한 border 속성은 margin 속성, 그리고 padding 속성처럼 left, top , right, bottom 각각 의 값을 적용할 수 있다.
2. border-radius 속성.
border-radius 속성을 통해 테두리의 모양을 변경할 수 있습니다.
See the Pen by yeojinho (@yeojinho) on CodePen.