HTML <blockquote> Tag
Definitie en gebruik
<blockquote>
tag definieert een gedeelte van een citaat van een andere bron.
Browsers springen meestal in: <blockquote>
element (zie de onderstaande voorbeelden om te zien hoe je inspringing kunt verwijderen).
Uitleg
<blockquote>
tag definieert een blockquote.<blockquote>
met </blockquote>
Alle tekst tussen deze tags wordt afgescheiden van de standaardtekst, en wordt vaak ingesprongen (marginaal uitgebreid) aan weerszijden, en soms in cursief geschreven. Dit betekent dat blockquotes hun eigen ruimte hebben.
Tip:Gebruik <q> tag voor inlinere (korte) citaten.
Zie ook:
HTML DOM-handboek:Blockquote-object
Voorbeeld
Voorbeeld 1
Gedeelte van een citaat van een andere bron:
<blockquote cite="http://www.worldwildlife.org/who/index.html"> Tijdens 50 jaar heeft de World Wildlife Fund (WWF) zich toegelegd op de bescherming van de toekomst van de natuur. Als wereldleider in bescherming, werkt WWF in 100 landen en ontvangt steun van 1,2 miljoen leden in de Verenigde Staten en bijna 5 miljoen mensen wereldwijd. </blockquote>
Voorbeeld 2
Gebruik CSS om de inspringing van blockquote-elementen te verwijderen:
<html> <head> <style> blockquote { margin-left: 0; } </style> </head> <body> <p>Dit is een citaat van de World Wildlife Fund-website:</p> <blockquote cite="http://www.worldwildlife.org/who/index.html"> Tijdens 50 jaar heeft de World Wildlife Fund (WWF) zich toegelegd op de bescherming van de toekomst van de natuur. Als wereldleider in bescherming, werkt WWF in 100 landen en ontvangt steun van 1,2 miljoen leden in de Verenigde Staten en bijna 5 miljoen mensen wereldwijd. </blockquote> </body> </html>
Attribute
Attribute | Value | Description |
---|---|---|
cite | URL | Specifies the source of the reference. |
Global attributes
<blockquote>
The tag also supports Global attributes in HTML.
event attributes
<blockquote>
The tag also supports Event attributes in HTML.
Default CSS settings
Most browsers will display the following default values <blockquote>
Element:
blockquote { display: block; margin-top: 1em; margin-bottom: 1em; margin-left: 40px; margin-right: 40px; }
Browser support
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Support | Support | Support | Support | Support |