HTML에서 border 속성은 요소 주변에 테두리를 추가하여 디자인을 다채롭게 만들고, 특정 영역을 구분하는 데 사용됩니다. CSS를 통해 border 속성을 조절하여 다양한 스타일의 테두리를 만들 수 있습니다.
border: 두께 스타일 색상;
<!DOCTYPE html>
<html>
<head>
<title>border 속성 예시</title>
<style>
div {
border: 2px solid black; /* 모든 테두리에 2px 검은색 실선 적용 */
}
.red-border {
border: 4px dashed red; /* 4px 빨간색 점선 */
}
.rounded-border {
border: 3px solid blue;
border-radius: 10px; /* 모서리 둥글게 만들기 */
}
</style>
</head>
<body>
<div>기본 테두리</div>
<div class="red-border">빨간색 점선 테두리</div>
<div class="rounded-border">파란색 둥근 테두리</div>
</body>
</html>
border 속성은 HTML 요소의 디자인을 다양하게 만들고, 특정 영역을 구분하는 데 매우 유용한 도구입니다. 다양한 속성 값을 조합하여 자신만의 스타일을 만들어 보세요.
HTML 목록을 이용한 메뉴만들기 (0) | 2024.11.04 |
---|---|
목록 스타일 (List Style) (0) | 2024.11.04 |
HTML 표 (Table)에 대한 자세한 설명 및 선 속성 (0) | 2024.11.04 |
display: inline-block (0) | 2024.11.04 |
블록 레벨과 인라인 레벨: HTML 요소의 기본 이해 (1) | 2024.11.04 |