HTML5

O HTML tem muitas tags que muitas pessoas usam todos os dias, como <div>, <p> e <a>. Mas também existem algumas joias escondidas que frequentemente passam despercebidas. Essas tags podem ajudar a tornar os sites mais envolventes, acessíveis e significativos sem muito esforço extra. Neste artigo, discutiremos um grupo de elementos HTML únicos que podem aprimorar suas páginas da web. Eles oferecem funções específicas para formatar texto, melhorar a legibilidade e adicionar recursos interativos. Sumário A Tag <q>: Citações Inline…

Você já quisera criar suas próprias ferramentas interativas usando apenas HTML, CSS e JavaScript? Neste artigo, vamos criar um projeto divertido e direto: uma ferramenta de seleção de cor. Esta simpática pequena ferramenta permitirá aos usuários selecionar qualquer cor que desejarem e ver instantaneamente seus valores HEX e RGB. Então, pegue em seu editor de código favorito e vamos começar! Passo 1: Configurar seu Projeto Criar uma Nova Pasta: Comece criando uma nova pasta no seu computador para este projeto.…

Construir projetos é muito importante para aprender a programar. Quando você cria um projeto, expande seu portfólio e aprende a aplicar suas habilidades a novas situações. Nós acabamos de publicar um curso de 2 horas no canal YouTube freeCodeCamp.org em espanhol que vai guiar você passo a passo através da construção de 3 projetos com HTML, CSS e JavaScript. Você vai praticar suas habilidades construindo uma barra de navegação responsiva com menus dropdown, um slider e uma página de destino…

HTML5 Canvas e SVG são ambas tecnologias baseadas em padrões do HTML5 que você pode usar para criar incríveis gráficos e experiências visuais. A questão que estou fazendo neste artigo é a seguinte: Deve importar qual delas você usa em seu projeto? Em outras palavras, existem casos de uso para preferir o HTML5 Canvas sobre o SVG? Primeiro, vamos dedicar algumas palavras para introduzir o HTML5 Canvas e o SVG. O que é HTML5 Canvas? Aqui está como a especificação…

Neste tutorial, faremos uma análise aprofundada do pouco utilizado elemento HTML5 <datalist>. Ele pode implementar um controle de autocomplete leve, acessível e multi-navegador que não requer JavaScript. Qual é o Problema com o <select>? Os controles HTML5 <select> são ideais quando você quer que o usuário escolha de um pequeno conjunto de opções. Eles são menos práticos quando: há muitas opções, como países ou títulos de emprego o usuário quer inserir sua própria opção que não está na lista A…

Neste artigo, vamos explorar algumas maneiras simples de estilizar o elemento HTML <details>, que é um elemento muito útil para revelar e ocultar partes de conteúdo em uma página web. É útil ter um elemento de divulgação simples em HTML que não requer JavaScript, mas o estilo padrão do <details> pode não agradar a todos. Felizmente, é bastante fácil alterar o estilo deste elemento. A tabela de conteúdos abaixo é um exemplo do elemento <details> em uso. Adicionamos uma borda…

Neste artigo, examinamos os campos de formulário HTML e as opções de validação oferecidas pelo HTML5. Também veremos como essas opções podem ser aprimoradas através do uso do CSS e do JavaScript. O que é Validação por Restrições? Cada campo de formulário tem um propósito. E esse propósito geralmente é governado por restrições — ou as regras que regem o que deve e não deve ser inserido em cada campo de formulário. Por exemplo, um campo email exigirá um endereço…

Por algum tempo, tenho criado essas cenas 3D com CSS apenas por diversão — geralmente durante minha transmissão ao vivo. Avião de Estilo 3D CSS Responsivo! 🛩️ Faz loops e rolagens! 😎 Reage ao movimento do mouse 🐭 👉 https://t.co/A1zNmfEzzi via @CodePen pic.twitter.com/87D7LIXLr2 — Jhey 🐻🛠 (Exploring Opportunities ✨) (@jh3yy) March 27, 2021 Cada demonstração é uma oportunidade para tentar algo diferente ou descobrir maneiras de fazer coisas com CSS. Uma coisa que frequentemente faço é aceitar sugestões sobre o…