테두리와 둥근 모서리
Coddy의 CSS 프로젝트 - 멋진 버튼 코스 레슨 — 8개 중 5번째.
HTML의 button 요소는 기본 테두리를 가지고 있습니다. 이를 커스텀해 봅시다!
둥근 테두리를 만들려면 border-radius 속성을 사용하세요 (padding이나 margin에서와 동일한 값을 사용합니다). 예를 들어,
#rounded {
border-radius: 8px;
}테두리를 완전히 제거하려면 다음과 같이 작성하여 오버라이드할 수 있습니다.
#no-border {
border: none;
}팁:
border-radius를 큰 값으로 설정하면 원 모양이 됩니다!
챌린지
쉬움작업:
- border radius를 0보다 큰 값으로 변경하세요
- border를 기본값과 다른 값으로 변경하세요
직접 해보기
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Write HTML code here -->
</body>
</html>