Kenarlık ve Radius
Coddy'nin CSS Projesi - Şık Buton kursunda ders 5 / 8.
HTML'deki button öğesi varsayılan bir kenarlıkla gelir, hadi bunu özelleştirelim!
Yuvarlatılmış kenarlık yapmak için border-radius özelliğini kullanın (padding veya margin ile aynı değerleri kullanın), örneğin,
#rounded {
border-radius: 8px;
}Kenarlığı tamamen kaldırmak için şunu kullanarak geçersiz kılabilirsiniz,
#no-border {
border: none;
}İpucu: eğer
border-radiusdeğerini büyük bir değere ayarlarsanız, daire şekli alacaktır!
Görev
KolayGörevler:
- Kenar yuvarlama (border radius) değerini 0'dan büyük bir değerle değiştirin
- Kenarlığı (border) varsayılandan farklı bir değerle değiştirin
Kendin dene
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Write HTML code here -->
</body>
</html>