Lädt...

HTML Id

Nach class kommt id als einzigartiges Türschild.

Warum einzigartige Namen zählen

Fragment-Links erwarten genau einen Treffer.

Direkte Antwort

id="faq" einmal. href="#faq". CSS #faq. Kein id="#faq". Für geteilte Styles class nutzen.

📊 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

Fragment-Link zu einer Überschrift

Sprunglink oben, id unten.

Unique id and fragment link

html
HTML Code
<p><a href="#faq">Jump to FAQ</a></p>
<h2 id="faq">FAQ</h2>
<p>Answers go here.</p>

Fragmentbeispiel lesen

  • nur im Link

  • nackter Name im Attribut

Einzigartiger CSS-Hook mit #id

Ein Panel — sparsam einsetzen.

Unique id with CSS

html
HTML Code
<div id="promo">
<h2>Limited offer</h2>
<p>One panel, one unique hook.</p>
</div>
<style>
#promo { border: 2px solid #0a7; padding: 12px; }
</style>

Unique-Style lesen

  • promo in CSS

  • kein # im Attribut

id oder class wählen

Mehrere Elemente? class. Ein Ziel? id.

Übung

  1. Überschrift mit id
  2. Link # und springen
  3. Duplikate entfernen
  4. class für Tipps

Typische Fehler

  • doppelte id
  • im Attribut

  • id für jeden Shared-Style

Kurzfassung

  • id einzigartig
  • in href/CSS

  • class zum Teilen

🧠 Testen Sie Ihr Wissen

Bereit zum Start

Testen Sie Ihr Wissen

Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen

❓
6
Fragen
🎯
70%
Zum Bestehen
♾️
∞
Zeit
🔄
∞
Versuche

📝 Anweisungen

  • Lesen Sie jede Frage sorgfältig
  • Wählen Sie die beste Antwort für jede Frage
  • Sie können das Quiz so oft wiederholen, wie Sie möchten
  • Ihr Fortschritt wird oben angezeigt