Bordas e Raio
Lição 5 de 8 do curso Projeto CSS - Botão Estilizado da Coddy.
O elemento button no HTML vem com uma borda padrão, vamos personalizá-lo!
Para criar bordas arredondadas, use a propriedade border-radius (use os mesmos valores que em padding ou margin), por exemplo,
#rounded {
border-radius: 8px;
}Para remover a borda completamente, você pode sobrescrevê-la usando,
#no-border {
border: none;
}Dica: se você definir o
border-radiuscom um valor alto, ele ganhará um formato circular!
Desafio
FácilTarefas:
- Altere o border radius para um valor maior que 0
- Altere a borda para algo diferente do padrão
Experimente você mesmo
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<!-- Write HTML code here -->
</body>
</html>