Co je to blockquote?

Pokud jste se někdy podívali na seznam prvků HTML, možná jste zjistili, že se ptáte „co je to blockquote?“ Prvek blockquote je Značka HTML pár, který se používá k definování dlouhých nabídek. Zde je definice tohoto prvku podle Specifikace W3C HTML5:

Prvek blockquote představuje část, která je citována z jiného zdroje.

Jak používat Blockquote na vašich webových stránkách

Když píšete text na webovou stránku a vytváříte rozvržení této stránky, někdy budete chtít vyvolat blok textu jako nabídku. Může to být nabídka odjinud, například posudek zákazníka, který doprovází případovou studii nebo příběh o úspěchu projektu.

Může to být také designové zpracování, které opakuje nějaký důležitý text z článku nebo samotného obsahu. Ve vydavatelství se tomu někdy říká a vytáhnout nabídku„Ve webovém designu se jeden ze způsobů, jak toho dosáhnout (a způsobu, kterému se v tomto článku věnujeme), říká blockquote.

Pojďme se tedy podívat na to, jak byste pomocí značky blockquote definovali dlouhé citace, například tento výňatek z knihy „The Jabberwocky“ od Lewise Carrolla:

„Bylo to brilantní a štěrbinové
Gyr a gimble ve wabe:
Všichni mimsy byli borogové,
A maminka raths outgrabe.

(Lewis Carroll)

Příklad použití značky Blockquote

Značka blockquote je sémantická značka, která prohlížeči nebo uživatelskému agentovi sděluje, že obsah je dlouhý citát. Jako takový byste neměli do tagu blockquote vložit text, který není citací.

Když o tom přemýšlíte, tahová citace je citací textu, stane se to ze stejného článku, ve kterém se citace sama objevuje.

Většina webových prohlížečů přidává na obě strany blockquote určité odsazení (asi 5 mezer), aby vyniklo nad okolním textem. Některé extrémně staré prohlížeče mohou dokonce citovaný text vykreslit kurzívou. Nezapomeňte, že toto je jednoduše výchozí styl prvku blockquote.

S CSS máte úplnou kontrolu nad tím, jak se zobrazí váš blockquote. Chcete-li dále vyvolat nabídku, můžete zvětšit nebo dokonce odstranit odsazení, přidat barvy pozadí nebo zvětšit velikost textu. Tuto nabídku můžete umístit na jednu stranu stránky a nechat kolem ní zalomit další text, což je běžný vizuální styl používaný pro úvodní nabídky v tištěných časopisech.

Vzhled blockquote máte pod kontrolou pomocí CSS, o čemž se budeme v nejbližší době bavit. Prozatím pokračujme v tom, jak přidat samotnou nabídku do svého označení HTML.

Chcete-li do svého textu přidat značku blockquote, jednoduše text, který je citací, obklopte následujícím párem značek:

• Otevírací:
• Uzavření:

Například:

„Bylo to brilantní a štěrbinové.
Gyr a gimble ve wabe:
Všichni mimsy byli borogové,
A maminka raths outgrabe.

Přidejte pár značek blockquote kolem obsahu samotné nabídky. V tomto příkladu jsme také použili některé rozbít značky (
) pro přidání konců řádků, pokud je to vhodné, do textu. Je to proto, že znovu vytváříme text z básně, kde jsou tyto konkrétní přestávky důležité.

Pokud jste vytvářeli nabídku posudku od zákazníka a řádky se nemuseli dělit na konkrétní části, vy nechtěl by přidat tyto značky přerušení a umožnit samotnému prohlížeči, aby se podle potřeby zalomil a rozbil podle obrazovky velikost.

Nepoužívejte Blockquote k odsazení textu

Po mnoho let lidé používali značku blockquote, pokud chtěli na své webové stránce odsadit text, i když tento text nebyl úvodní citací. To je špatný postup! Nechcete používat sémantiku blockquote pouze z vizuálních důvodů.

Pokud potřebujete odsadit text, měli byste používat šablony stylů, nikoli značky blockquote (pokud samozřejmě není snahou o odsazení citát!).