O que é Estilo CSS (Cascading Style Sheets)
O estilo CSS, ou Cascading Style Sheets, é uma linguagem de folha de estilo utilizada para descrever a apresentação de um documento escrito em HTML (HyperText Markup Language). Com o CSS, é possível controlar a aparência de um site, incluindo o layout, as cores, as fontes e outros elementos visuais. O CSS permite separar o conteúdo do design, facilitando a manutenção e a atualização de um site.
Como funciona o CSS
O CSS funciona através da criação de regras que são aplicadas a elementos HTML específicos. Essas regras são escritas em um arquivo separado, chamado de arquivo de estilo, que é vinculado ao documento HTML. Quando um navegador lê o documento HTML, ele também carrega o arquivo de estilo e aplica as regras definidas no CSS aos elementos correspondentes no HTML.
Sintaxe do CSS
A sintaxe do CSS é composta por seletores e declarações. Os seletores são usados para identificar os elementos HTML aos quais as regras serão aplicadas, enquanto as declarações definem como esses elementos devem ser estilizados. Cada declaração é composta por uma propriedade e um valor, separados por dois pontos. Várias declarações podem ser agrupadas dentro de chaves.
Seletores CSS
Existem diferentes tipos de seletores CSS que podem ser usados para aplicar regras a elementos HTML específicos. Alguns exemplos comuns incluem:
- Seletores de elemento: aplicam regras a todos os elementos de um determinado tipo, como
p
para parágrafos ouh1
para títulos de nível 1. - Seletores de classe: aplicam regras a elementos que possuem uma determinada classe atribuída, como
.destaque
para elementos com a classe “destaque”. - Seletores de ID: aplicam regras a um elemento específico que possui um ID único, como
#cabecalho
para o elemento com o ID “cabecalho”. - Seletores de descendente: aplicam regras a elementos que são descendentes de outro elemento, como
div p
para todos os parágrafos que estão dentro de uma div.
Propriedades CSS
As propriedades CSS são usadas para definir como os elementos HTML devem ser estilizados. Existem centenas de propriedades CSS disponíveis, que podem ser usadas para controlar aspectos como cor, tamanho, fonte, margens, preenchimento, entre outros. Alguns exemplos de propriedades CSS incluem:
color
: define a cor do texto.font-size
: define o tamanho da fonte.margin
: define as margens ao redor de um elemento.padding
: define o preenchimento interno de um elemento.background-color
: define a cor de fundo de um elemento.
Herança CSS
Uma das características poderosas do CSS é a capacidade de herdar estilos de elementos pai. Isso significa que um elemento filho pode herdar as propriedades CSS definidas para seu elemento pai, a menos que essas propriedades sejam especificamente sobrescritas. A herança CSS permite economizar tempo e esforço, pois é possível definir estilos em um único local e aplicá-los a vários elementos.
Cascata CSS
O termo “cascata” no Cascading Style Sheets refere-se à maneira como as regras CSS são aplicadas a um documento HTML. Quando várias regras são aplicadas a um mesmo elemento, o CSS utiliza uma ordem de precedência para determinar qual regra deve ser aplicada. Essa ordem é baseada em fatores como a especificidade do