Sombras

Lição 6 de 8 do curso Projeto CSS - Botão Estilizado da Coddy.

É uma prática comum adicionar efeitos de sombra a botões para dar a eles uma sensação de elevação e de que são clicáveis.

Para adicionar sombra em CSS, usamos a propriedade box-shadow,

#with-shadow {
	box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25)
}

Leia mais

Desafio

Fácil

Adicione sombras ao seu botão!

Dica: é uma boa prática usar a cor rgba(0, 0, 0, 0.25) como a cor da sombra (você pode brincar com a opacidade - 0.25)

Experimente você mesmo

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
    </body>
</html>

Todas as lições de Projeto CSS - Botão Estilizado

1Introdução

Introdução Parte de HTML

2O Projeto CSS

Sombras