HTML Element - blockquote

Das blockquote-Element dient zur strukturierten Kennzeichnung längerer Zitate im Dokument.

Beispiel

<h1>Ein Zitat von Tim Berners-Lee</h1>
<blockquote>"In meiner Vision für eine alternative digitale Welt gibt es zwar all die Nutzerdaten von heute, aber die Nutzer selbst verfügen über sie."</blockquote>

Definition und Verwendung

Das blockquote-Tag kennzeichnet einen eigenständigen, zusammenhängenden Textabschnitt, der aus einer externen Quelle zitiert wird.

Das blockquote-Element kann mit CSS individuell angepasst werden.

Das blockquote-Element wird als Block dargestellt und eignet sich für eigenständige Zitatabschnitte. Für kurze Zitate innerhalb eines Fließtextes eignet sich das q-Element besser.

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.

Attribut: cite

Attribut Wert Beschreibung
URL Gibt die Quelle eines Zitats an.

Beispiel:

<h1>Ein Zitat von Tim Berners-Lee</h1>
<blockquote cite="https://www.zeit.de/1997/34/titel.txt.19970815.xml/">"In meiner Vision für eine alternative digitale Welt gibt es zwar all die Nutzerdaten von heute, aber die Nutzer selbst verfügen über sie."</blockquote>

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.


blockquote {
display: block;
margin-top: 1em;
margin-bottom: 1em;
margin-left: 40px;
margin-right: 40px;
}

Beispiel mit CSS Anpassung

<!DOCTYPE html>
<html>
<head>
<style>
blockquote {
margin-left: 0;
font-weight: 600;
}
</style>
<head>

<body>
<h1>Ein Zitat von Tim Berners-Lee</h1>
<blockquote cite="https://www.zeit.de/1997/34/titel.txt.19970815.xml/">"In meiner Vision für eine alternative digitale Welt gibt es zwar all die Nutzerdaten von heute, aber die Nutzer selbst verfügen über sie."</blockquote>
</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.

Diese Tabelle zeigt die Unterstützung des blockquote durch gängige Webbrowser und ordnet dessen Verfügbarkeit im aktuellen Browserumfeld ein.
Element Firefox Internet Explorer / Edge Safari Chrome Opera
<blockquote>