<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Especificidade CSS</title>
<style>
/* https://developer.mozilla.org/pt-BR/docs/Web/CSS/Specificity */
/*
Em linhas gerais...
1. regra com !important
2. seletores mais específicos
3. última regra processada (empate)
*/
/* definindo a propriedade do paragráfo */
p {
background-color: orange;
}
/* definindo propriedade da classe observação */
.observacao{
background-color: #5f5;
border: dashed 5px;
padding: 20px;
font-size: 40px;
width: 300px;/*comprimento*/
}
p.observacao{
padding: 2px;
background: linear-gradient(to right, red, yellow);
}
</style>
</head>
<body>
<p class='observacao'>Olha essa observação!!!!</p>
</body>
</html>
Nenhum comentário:
Postar um comentário