A documentação da MDN (Mozilla Developer Network) é uma das melhores fontes para aprender sobre CSS. Ela aborda seletores de forma detalhada, desde os básicos, como seletores de classe (.classe) e ID (#id), até os mais avançados, como:
Pseudo-classes: Ex.: :hover, :nth-child() Atributos: Ex.: [type="text"], [href^="https"] Combinadores: Ex.: div + p, ul > li, section ~ article Essa leitura é essencial para entender como combinar e aplicar seletores para estilizar elementos de forma precisa. Por exemplo:
css Copiar Editar /* Estiliza apenas o primeiro parágrafo dentro de um div */ div > p:first-child { color: blue; } Acesse a documentação de seletores CSS na MDN e explore os exemplos interativos que vão te ajudar a fixar o conteúdo.
Reset CSS: Por que é tão importante? No Front-end, um dos primeiros desafios que enfrentamos ao estilizar páginas é a inconsistência entre navegadores. Cada navegador tem seus estilos padrão para elementos HTML, o que pode causar diferenças no layout. É aqui que o Reset CSS entra como solução.
O que é Reset CSS? O Reset CSS é um conjunto de estilos que "zera" os estilos padrão aplicados pelos navegadores. Ele remove margens, paddings, bordas e outros estilos predefinidos, garantindo que você comece a estilização de uma base limpa e consistente.
Exemplo de Reset CSS básico: css Copiar Editar /* Reset CSS básico */
- { margin: 0; padding: 0; box-sizing: border-box; } Por que usar Reset CSS? Remove inconsistências entre navegadores. Dá total controle sobre o estilo de cada elemento. Evita surpresas ao trabalhar em layouts responsivos. Ferramentas e Recursos Existem resets prontos que podem ser utilizados, como o famoso Normalize.css, que não apenas reseta, mas também aprimora estilos para elementos comuns:
Normalize.css no GitHub
