Código HTML para Marcação - Como Encontrar e Usá-lo
Resposta Rápida
Se você precisa exibir uma marcação em HTML, use as entidades HTML ✓ (✓) para uma marcação regular ou ✔ (✔) para uma marcação em negrito. Insira esses códigos diretamente em seu documento HTML para exibir os símbolos correspondentes.
Exemplo:
<p>Marcação: ✓ (✓) <!-- Design simples da marcação destaca sua elegância. --></p>
<p>Marcação em Negrito: ✔ (✔) <!-- Um símbolo claro e decisivo. --></p>Alternativas: Opções de Imagem
As entidades HTML são uma ótima escolha por sua simplicidade. No entanto, existem casos em que elas podem não ser adequadas. Para dar suporte a navegadores mais antigos, você pode usar imagens:
<img src="checkmark.png" alt="Marcação"> <!-- Às vezes, uma única imagem fala mais alto que palavras. -->Certifique-se de esclarecer os direitos de uso da imagem e incluir uma descrição no atributo alt, o que é crucial para pessoas que utilizam leitores de tela.
Codificação Hexadecimal e Decimal
Cada símbolo de marcação possui sua própria codificação hexadecimal e decimal:
- Hexadecimal:
✓(✓) ou✔(✔) - Decimal:
✓(✓) ou✔(✔)
A codificação hexadecimal é mais comumente usada, pois é mais fácil de ler e está alinhada com os padrões Unicode, mas ambas as opções funcionam bem em HTML. Escolha a que for mais conveniente para você.
Alternativas: Trabalhando com Navegadores Antigos
Garantir a compatibilidade com navegadores mais antigos é um fator importante. Teste sempre suas páginas em diversos ambientes. Se os símbolos não forem exibidos corretamente, considere usar imagens ou CSS:
.check::before {
content: "✔"; // Aproveite as capacidades do CSS.
}Esse código CSS adiciona um símbolo de marcação antes de qualquer elemento com a classe check.
Visualização
Vamos visualizar:
✓ – abre caminho para uma marcação concisa.
Chave: 🗝️ => Marcação: ✓✔ – oferece acesso a uma representação mais ousada.
Chave: 🔑 => Marcação: ✔As entidades HTML podem ser vistas como ferreiros forjando chaves e símbolos.
Unicode: O Senhor dos Símbolos
Para garantir a exibição correta de marcações e outros símbolos, salve seu arquivo HTML em codificação Unicode (UTF-8 ou UTF-16). Isso ajuda a evitar distorções indesejadas e problemas de exibição.
Além disso, recursos como AmpWhat ou a lista de caracteres Unicode na Wikipedia podem ser excelentes maneiras de explorar além de simples marcações, revelando uma paleta de possibilidades Unicode.
Estilização: Vestindo a Marcação
Estilizar símbolos é o ponto sobre o "i." Use CSS para estilizar as entidades HTML de marcações:
.custom-check {
color: green; // A cor verde é associada à marcação na forma de "Sim" ou "Não."
font-size: 2em; // Aumente o tamanho do símbolo para melhor visibilidade.
}Inserção Dinâmica: JavaScript ao Resgate
Se você precisa de uma abordagem mais dinâmica, use JavaScript para inserir marcações no DOM:
document.getElementById('check-container').innerHTML = '✔'; // Use JavaScript para mudanças rápidas de conteúdo.Essa abordagem pode ser útil ao precisar adicionar símbolos interativamente "em tempo real."
Recursos Úteis
- Padrão HTML — um olhar detalhado sobre as entidades HTML nomeadas.
- Dingbats Unicode HTML — um guia sobre símbolos Unicode, incluindo marcações.
- Glyphs | CSS-Tricks — um guia abrangente sobre como usar glifos em HTML.
- Entidade - Glossário MDN Web Docs — uma explicação completa sobre o que são entidades HTML, com exemplos práticos.
- Referências de entidades de caracteres no HTML 4 — informações úteis sobre entidades de versões anteriores do HTML.
- Símbolos, Entidades e Códigos HTML — Toptal Designers — uma tabela de caracteres imprimível para fácil acesso.
- Descubra Entidades e Símbolos de Caracteres Unicode | AmpWhat — uma ferramenta útil para explorar e usar símbolos Unicode em seus projetos.