O que é o CSS
CSS é uma linguagem de estilização de paginas em estilo cascata, serve para adicionar layouts, animações, formas geométricas, filtros, contadores, entre outras configurações.
Formas de declarar o CSS
CSS inline : Adiciona o CSS utilizando o atributo style dentro das tags HTML;
CSS interno : Adicionado dentro da tag <head>
da página HTML;
CSS externo : É criado um arquivo com a extensão .css
com todas as regras que vão ser aplicadas e esse arquivo no HTML com a tag <link>
.
<head>
<link rel="stylesheet"
href="estilos.css" />
<head/>
Seletores
- Tag: busca elementos por uma tag
- ID(#): busca elementos através de ID
- Classes(.): atributo "class"
- Seletor de atributo ([atrib]): elementos com atributos específicos
- Universal (*): Seleciona todos os elementos HTML
Combinadores
Combinadores unem níveis de seletores de tags a quais as configurações serão aplicadas em comum.
- Descendente: tags que descendem de outra são aplicadas com um espaço entre eles. Exemplo:
div span{
regra: CSS;
}
- Filho: Todos os elementos filhos imediatos conectados com ">". Exemplo
ul > li{
regra: CSS;
}
- Irmão adjacente: O primeiro elemento que segue diretamente conectados com "+". Exemplo:
ul + li {
regra: CSS;
}
//Nesse caso, havendo mais que um elemento li na lista, somente o primeiro receberá a regra
- Geral de irmãos: Conecta todos os elementos que tiverem sob o mesmo pai com "~". Exemplo:
p ~ span{
regra: css;
}
Top comments (1)
Interessante, não conhecia o último combinador (
~
).Se eu puder contribuir de alguma forma, acho que vale adicionar também o
,
para selecionar diferentes tipos de elementos, mas que receberão a mesma regra CSS: