Exemplo
Selecionar e estilo a cada <p> elemento que é o primeiro filho de seu pai:
p:first-child
{
background-color: yellow;
}
Tente você mesmo " Mais "Try it Yourself" exemplos abaixo.
Definição e Uso
A: selector primeiro-criança é usado para selecionar o seletor especificado, somente se ele é o primeiro filho de seu pai.
Versão: | CSS2 |
---|
Suporte a navegadores
Os números na tabela especifica a primeira versão do navegador que suporta plenamente o selector.
seletor | |||||
---|---|---|---|---|---|
:first-child | 4.0 | 7 | 3.0 | 3.1 | 9,6 |
Note: Para: primeira criança a trabalhar no IE8 e anteriores, a <! DOCTYPE> deve ser declarada.
CSS Syntax

mais Exemplos
Exemplo
Selecione e estilo todos os <i> elemento de cada <p> elemento, onde o <p> elemento é o primeiro filho de seu pai:
p:first-child i
{
background: yellow;
}
Tente você mesmo " Exemplo
Selecione e estilo a primeira <li> elemento na lista:
li:first-child
{
background: yellow;
}
Tente você mesmo " Exemplo
Selecione e estilizar o primeiro elemento filho de cada <ul> elemento:
ul > :first-child
{
background: yellow;
}
Tente você mesmo " Páginas relacionadas
Tutorial CSS: as classes CSS Pseudo