Um reset de CSS é uma folha de estilo que remove toda ou parte da formatação padrão que os navegadores aplicam aos elementos HTML. Por exemplo, você pode ter notado que certos elementos, como parágrafos e títulos, já possuem margens por padrão mesmo que você não as defina explicitamente em suas folhas de estilo personalizadas. Você também verá isso com várias propriedades em uma ampla variedade de elementos HTML. Navegadores diferentes também podem aplicar estilos padrão diferentes aos elementos HTML. Os estilos padrão no Google Chrome podem não ser exatamente os mesmos no Mozilla Firefox ou Microsoft Edge. Isso pode resultar em estilos inconsistentes entre os navegadores que você deve evitar ao máximo. Para lidar com isso, um reset de CSS remove os estilos padrão. Ao remover todos ou alguns dos estilos padrão, você pode obter uma base consistente para seu design e minimizar as potenciais inconsistências entre navegadores e dispositivos. Remover estilos padrão também pode facilitar o processo de estilização porque você verá apenas os estilos que aplicou explicitamente em suas folhas de estilo personalizadas. Existem duas abordagens principais para resets de CSS: você pode definir resets de CSS personalizados ou usar resets de CSS de terceiros. Resets de CSS personalizados são folhas de estilo que você cria do zero para atender à necessidade do seu projeto. Dessa forma você pode controlar os estilos específicos que serão resetados com muita flexibilidade. No entanto, você também precisa investir tempo para desenvolver e manter as folhas de estilo. Aqui está um exemplo de uma regra CSS muito comum para redefinir a margem e o padding de todos os elementos HTML:

<link rel="stylesheet" href="styles.css">
<h1>Example Heading</h1>
<p>This is a paragraph.</p>

* {
  margin: 0;
  padding: 0;
}

Geralmente é escrito no topo da folha de estilos CSS. The asterisk selector is a wildcard selector that matches all HTML elements, so they will have a default margin of zero and a default padding of zero on all four sides. Isso lhe dará um ponto de partida e então você poderá personalizá-los em seletores CSS mais específicos mais adiante na folha de estilo. Você pode usar essa abordagem para selecionar qualquer elemento HTML e redefinir seus estilos padrão. Basta criar uma folha de estilo personalizada e usar os seletores CSS apropriados para corresponder aos elementos e definir os estilos. Mas isso pode ser um processo que consome muito tempo. Se você quiser economizar tempo, também pode usar um reset CSS de terceiros. Essas folhas de estilo já estão pré-construídas para que você possa simplesmente baixá-las e adicioná-las diretamente ao seu projeto. Um ótimo exemplo de reset CSS de terceiros é Normalize.css. Essa folha de estilo normaliza estilos para uma ampla variedade de elementos HTML mantendo alguns estilos padrão úteis especialmente aqueles que são importantes para acessibilidade. Ela também corrige bugs comuns e inconsistências de estilo. Outra opção é sanitize.css. Esta é uma biblioteca CSS que você pode usar para garantir que os estilos padrão sejam consistentes em todos os principais navegadores modernos. This library is developed alongside Normalize.css, so they evolve together. Ele também possui folhas de estilo individuais que você pode baixar para propósitos específicos como normalizar formulários e tipografia. Existem muitas opções disponíveis mas você deve escolher as que melhor atendem às necessidades do seu projeto. Você também pode combinar ambas as abordagens usando resets CSS de terceiros com resets personalizados. Ao trabalhar com resets de CSS, também é importante levar em conta a acessibilidade. Sua aplicação web deve ser acessível para todos. Então, você não deve redefinir estilos que possam ser úteis para leitores de tela ou outras tecnologias assistivas. Você também deve considerar o impacto que essas folhas de estilo adicionais podem ter no desempenho das suas aplicações, porque elas precisam ser baixadas antes que os estilos personalizados sejam aplicados. Ao remover os estilos padrão, os resets de CSS oferecem um ponto de partida em branco para implementar seu design. Isso resulta em uma experiência do usuário mais uniforme e consistente entre navegadores e entre dispositivos.