29 lines
1.2 KiB
Markdown
29 lines
1.2 KiB
Markdown
|
---
|
||
|
|
title: Class
|
||
|
|
localeTitle: Classe
|
||
|
|
---
|
||
|
|
## Classe
|
||
|
|
|
||
|
|
O seletor de "classe" CSS é usado para aplicar o mesmo estilo a vários elementos na página. Uma ótima maneira de pensar nisso seria como a planta de um carro ou edifício. O plano permitirá que você construa vários carros ou vários edifícios da mesma maneira depois de projetar o layout real uma vez.
|
||
|
|
|
||
|
|
### Casos de Uso
|
||
|
|
|
||
|
|
Ao contrário dos nomes das classes CSS “ID”, os nomes não são exclusivos. Portanto, é bom que você use uma "classe" várias vezes se quiser que esses elementos tenham o mesmo estilo aplicado. Na verdade, esse seria um ótimo momento para você usar uma "aula". Se você quiser que três elementos "div" em seu HTML tenham um plano de fundo azul, você pode usar uma classe em seu CSS, como visto no exemplo. abaixo.
|
||
|
|
```
|
||
|
|
<html>
|
||
|
|
<style>
|
||
|
|
.blueBg {
|
||
|
|
background-color: blue;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<body>
|
||
|
|
<div class="blueBg"></div>
|
||
|
|
<div class="blueBg"></div>
|
||
|
|
<div class="blueBg"></div>
|
||
|
|
</body>
|
||
|
|
</html>
|
||
|
|
```
|
||
|
|
|
||
|
|
#### Mais Informações:
|
||
|
|
|
||
|
|
Se você gostaria de obter mais informações sobre o seletor "classe" CSS, visite [esta página](https://css-tricks.com/the-difference-between-id-and-class/)
|