Middle
Como você redefine os estilos nos seus projetos?
sobes.tech IA
Resposta da IA
Normalmente utilizo normalize.css como base. Ele uniformiza os estilos dos elementos para que sejam mais previsíveis em todos os navegadores, mantendo estilos úteis por padrão.
// Exemplo de parte do normalize.css
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
body {
margin: 0;
}
main {
display: block;
}
Às vezes, adiciono o meu pequeno reset ou conjunto de estilos básicos acima do normalize.css para tarefas específicas ou para eliminar margens e preenchimentos em alguns elementos.
// Estilos adicionais
*,
*::before,
*::after {
box-sizing: border-box; /* Torna o trabalho com tamanhos mais previsível */
}
body {
min-height: 100vh; /* Estica o corpo até toda a altura visível */
scroll-behavior: smooth; /* Rolagem suave para âncoras */
text-rendering: optimizeSpeed; /* Prefere velocidade de renderização */
}
a {
text-decoration: none; /* Remove o sublinhado dos links */
color: inherit; /* Os links herdam a cor do texto */
}
ul,
ol {
list-style: none; /* Remove marcadores de lista */
padding: 0;
margin: 0;
}
button,
input,
textarea,
select {
font: inherit; /* Elementos de formulário herdam a fonte do pai */
}
img {
max-width: 100%; /* Imagens não saem do contêiner */
display: block; /* Remove o espaço inferior em inline-blocks */
}
A escolha de uma abordagem específica depende dos requisitos do projeto e do framework utilizado. normalize.css é um bom compromisso entre um reset completo e estilos padrão.