Bem-vindo ao HTMLcat, uma coleção de pequenos truques web nativos que vale a pena lembrar. Cada post-it combina uma função útil da plataforma com um exemplo mínimo e a advertência que importa. As notas cobrem recursos estáveis, limitados e experimentais em HTML, CSS e JS.
Verifique a etiqueta de suporte, mantenha um fallback e teste com navegadores reais e tecnologia assistiva.\n\nOs truques em destaque incluem: detecção de tipo de dispositivo, ocultar barras de rolagem, tags vazias, centralização com CSS, `clamp()`, rolagem suave, margem de rolagem, `classList.toggle()`, links telefônicos e de e‑mail, realce de seleção de texto, seletor relacional `:has()`, estilizar marcadores de lista com `::marker`, preços localizados com `Intl. NumberFormat`, desativar subárvores com `inert`, a pseudo‑classe `:target`, o atributo `translate`, `prefers-color-scheme`, consultas de tamanho de contêiner, o elemento `<dialog>`, melhor embrulho com `text-wrap`, alinhamento de listas de descrição, cores de formulário nativas com `accent-color`, API de realce personalizado de CSS, detecção de hover em tipos de entrada, cores transparentes com `color-mix()`, eventos de snap de rolagem, `light-dark()`, `contrast-color()`, CSS com escopo via `@scope`, `:where()`, animações impulsionadas por rolagem, carrosséis CSS, `corner-shape`, funções personalizadas de CSS, faixas de CSS Grid, API Popover, API de Transições de Visão, consultas de estilo de contêiner, acordeões exclusivos com nome `details`, controle de diálogos com comandos de botão e conteúdo recolhido pesquisável com `hidden=until-found`.\n\nTodos os exemplos são pesquisáveis por título e conteúdo. Lembre-se de verificar o suporte do navegador e fornecer fallback para uso em produção.
Fonte: Hacker News · Resumido por HeadlinesBriefing