HTML Element - kbd
Das kbd-Element kennzeichnet Eingaben, die über eine Tastatur erfolgen.
Beispiel
<p>Mit <kbd>Strg</kbd> + <kbd>C</kbd> kann unter Windows markierter Inhalt in den Zwischenspeicher kopiert werden.</p>
<p>Für das kopieren von markierten Inhalt unter Mac OS gilt die Tastenkombination: <kbd>Cmd</kbd> + <kbd>C</kbd>.</p>
Definition und Verwendung
Das kbd-Element dient zur Kennzeichnung von Tastatureingaben. Der Inhalt des kbd-Tags wird in der Standard-Monospace-Schriftart des Browsers angezeigt.
Mit CSS lassen sich für das kbd-Element ansprechendere Effekte erzielen (siehe Beispiel unten).
Attribute
Attribute erweitern Elemente um zusätzliche Eigenschaften oder Informationen und beeinflussen deren Bedeutung, Verhalten oder Darstellung. Sie bestehen in der Regel aus einem Attributnamen und einem zugehörigen Wert, wobei die zulässigen Attribute vom jeweiligen Element abhängen und teils allgemein, teils elementbezogen definiert sind.
Eine besondere Gruppe bilden die aria-*-Attribute, die zur Unterstützung der Barrierefreiheit zusätzliche Informationen für assistive Technologien bereitstellen.
Unterstützung von Global- und Event-Attributen
Das kbd-Tag unterstützt auch Global- und Event-Attribute.
Standardbrowser CSS
Webbrowser wenden auf viele Elemente vordefinierte CSS-Stile an, die eine grundlegende Struktur und Lesbarkeit sicherstellen. Umfang und Ausgestaltung dieser Standardstile können je nach Browser variieren, etwa in Bezug auf Abstände, Schriftgrößen oder die Darstellung einzelner Elemente.
kbd {
font-family: monospace;
}
Beispiel mit: CSS
kbd-Tag wurde ein innerer Abstand mit padding und ein Rahmen mit border sowie abgerundete Ecken mit border-radius zugewiesen.
<!DOCTYPE html>
<html>
<head>
<style>
kbd {
padding: 3px 7px;
border: solid 1px #cfcfcf;
border-radius: 7px;
}
</style>
</head>
<body>
<p>Mit <kbd>Strg</kbd> + <kbd>C</kbd> kann unter Windows markierter Inhalt in den Zwischenspeicher kopiert werden.</p>
<p>Für das kopieren von markierten Inhalt unter Mac OS gilt die Tastenkombination: <kbd>Cmd</kbd> + <kbd>C</kbd>.</p>
</body>
</html>
Browserunterstützung
Die Unterstützung von Elementen und Attributen ist in den gängigen modernen Browsern weitgehend einheitlich gewährleistet. Unterschiede können dennoch in Details, im Einführungszeitpunkt neuer Funktionen oder bei experimentellen Features auftreten.
| Element | Firefox | Internet Explorer / Edge | Safari | Chrome | Opera |
|---|---|---|---|---|---|
<kbd> |