Id em HTML
Depois de class, id nomeia um único elemento.
Porque nomes únicos importam
Os saltos assumem uma correspondência.
Resposta direta
id="faq" uma vez. href="#faq". CSS #faq. Não id="#faq". Para estilos partilhados use class.
📊 id versus class
| Feature | id | class |
|---|---|---|
| Uniqueness | One per page (ideally) | Many elements may share |
| HTML attribute | id="faq" (no #) | class="tip" (no .) |
| CSS selector | #faq | .tip |
| Common uses | Bookmarks, unique hooks, script targets | Reusable styles and groups |
Link fragment para um título
Link em cima, id em baixo.
Unique id and fragment link
html<p><a href="#faq">Jump to FAQ</a></p>
<h2 id="faq">FAQ</h2>
<p>Answers go here.</p>
Leitura do fragment
-
só no link
- nome nu no atributo
Gancho CSS único com #id
Um painel — com parcimónia.
Unique id with CSS
html<div id="promo">
<h2>Limited offer</h2>
<p>One panel, one unique hook.</p>
</div>
<style>
#promo { border: 2px solid #0a7; padding: 12px; }
</style>
Leitura do estilo único
-
promo em CSS
- sem # no atributo
Escolher id ou class
Vários elementos? class. Um alvo? id.
Prática
- título com id
- link # e saltar
- remover duplicados
- class para tips
Erros fáceis
- id duplicado
-
no atributo
- id para cada estilo partilhado
Resumo
- id único
-
em href/CSS
- class para partilhar
🧠 Teste Seu Conhecimento
Teste Seu Conhecimento
Desafie-se com este questionário interativo e veja o quão bem você entende o tópico
📝 Instruções
- Leia cada pergunta cuidadosamente
- Selecione a melhor resposta para cada pergunta
- Você pode refazer o quiz quantas vezes quiser
- Seu progresso será mostrado no topo