HTML e CSS modernos: o essencial

Com poucos recursos modernos você constrói interfaces bonitas e responsivas sem frameworks.

HTML semântico

<header>…</header>
<main>
  <article>
    <h1>Título</h1>
  </article>
</main>
<footer>…</footer>

Grid responsivo em uma linha

.cards {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}

Variáveis CSS

:root { --cor-destaque: #A8B547; }
a { color: var(--cor-destaque); }

Assim, mudar a identidade do site é questão de alterar um único valor.