Às vezes pego sites prontos pra editar e percebo que no console aparece:
* {
/* código aqui */
}
O que significa esse asterisco?
*
é chamado de seletor universal. Esse seletor representa todos os elementos serão afetados pelas definições de estilo ali colocadas.
Por exemplo, eu costumo usar muito pra poder aplicar uma determinada estilização em todos os elementos da página:
* { box-sizing: border-box; }
É claro que deve-se ter cuidado ao usar o asterisco, para não afetar configurações padrões de alguns elementos.
Observe que, no caso específico da sua pergunta, o asterisco sozinho afeta todos os elementos, mas é possível afetar apenas todos elementos que sejam filho de outros.
Exemplo:
p * {
padding: 10px;
}
Ou seja, tudo que estiver dentro dos <p>
, vão ter o padding de 10px.
Além disso, é possível fazer várias outras combinações com o seletor *
, mas, em suma, ele sempre representará "todos os elementos".
*
, é sobre o comportamento de.classe
, agregar "conteúdo canônico" em portugues é fundamental para tornar o nosso site uma fonte mais confiável de pesquisa.