As jy ooit na 'n lys van HTML-elemente gekyk het, het jy dalk gevind dat jy "wat is 'n blokquote?" Die blokquote-element is 'n HTML-tagpaar wat gebruik word om lang kwotasies te definieer. Hier is die definisie van hierdie element volgens die W3C HTML5 spesifikasie:
Die blokquote-element verteenwoordig 'n gedeelte wat uit 'n ander bron aangehaal word.
Hoe om Blockquote op u webblaaie te gebruik
As jy teks op 'n webblad skryf en die uitleg van die bladsy skep, wil jy soms 'n blok teks as 'n kwotasie noem.
Dit kan 'n aanhaling uit iewers anders wees, soos 'n kliënt se getuigskrif wat 'n gevallestudie of projek suksesverhaal begelei. Dit kan ook 'n ontwerpbehandeling wees wat 'n paar belangrike teks uit die artikel of inhoud self herhaal. In die publikasie word dit soms 'n aanhalingstekens genoem . In webontwerp is een van die maniere om dit te bereik (en die manier waarop ons in hierdie artikel behandel word) 'n blokquote genoem.
Kom ons kyk hoe jy die blokkie-tag gebruik om lang kwotasies te definieer, soos hierdie uittreksel uit "The Jabberwocky" deur Lewis Carroll:
"Twas brillig en die slithey toves
Het gyre en gimble in die wabe:
Alle mimsy was die borogoves,
En die môre loop uit.
(deur Lewis Carroll)
Voorbeeld van die gebruik van die blokkie-tag
Die blockquote-tag is 'n semantiese merker wat die blaaier of gebruikeragent vertel dat die inhoud 'n lang aanhaling is. As sodanig moet u nie teks byvoeg wat nie 'n aanhaling in die blokkie-tag is nie. Onthou, 'n aanhaling is dikwels werklike woorde wat iemand gesê het of teks van 'n eksterne bron (soos die Lewis Carroll-teks in hierdie artikel), maar Dit kan ook die pullquote-konsep wees wat ons voorheen behandel het.
As jy daaraan dink, is die pullquote 'n aanhalingstekst van teks. Dit kom net uit dieselfde artikel wat die aanhaling self voorkom.
Die meeste web blaaiers voeg 'n paar inskrywings (ongeveer 5 spasies) aan weerskante van 'n blokkie by om dit uit die omliggende teks uit te steek. Sommige uiters ou blaaiers kan selfs die aangehaalde teks kursief maak.
Onthou, dit is bloot die verstekstylering van die blockquote-element. Met CSS het u totale beheer oor hoe u blokaanduiding sal vertoon. U kan die inspring verhoog of selfs verwyder, agtergrondkleure byvoeg of teksgrootte verhoog om die kwotasie verder uit te roep. Jy kan die aanhaling aan die een kant van die bladsy dryf en die ander teks wrap om dit, wat 'n algemeen visuele styl is wat gebruik word vir trekkwotasies in gedrukte tydskrifte. U het beheer oor die verskyning van die blokkie met CSS, iets wat ons kortliks sal bespreek. Laat ons voortgaan om te kyk hoe om die kwotasie self by jou HTML-opmaak by te voeg.
Om die blokquote-tag by jou teks by te voeg, skakel bloot die teks wat 'n aanhaling is met die volgende tagpaar -
Byvoorbeeld:
"Twas brillig en die slithey toves
Het gyre en gimble in die wabe:
Alle mimsy was die borogoves,
En die môre loop uit.
Soos u kan sien, voeg u eenvoudig die blokkie blokkies rondom die inhoud van die kwotasie self. In hierdie voorbeeld het ons ook 'n paar breekmerke gebruik (
) om enkele reëlpaaie by te voeg waar toepaslik binne die teks. Dit is omdat ons teks van 'n gedig herskep, waar daardie spesifieke breek belangrik is. As u 'n kwotasie vir kliënte getuigskrifte geskep het en die lyne nie in spesifieke dele moes breek nie, sou u nie hierdie breeketikette wou byvoeg nie en die blaaier self toelaat om te draai en te breek indien nodig, gebaseer op die skermgrootte.
Gebruik nie blokkie na indent teks nie
Vir baie jare het mense die blockquote-tag gebruik as hulle teks op hul webblad wou insleutel, al was die teks nie 'n pullquote nie. Dit is 'n slegte oefening! U wil nie die semantiek van blockquote net vir visuele redes gebruik nie. As jy jou teks wil inskryf, moet jy stylbladsye gebruik, nie die blokkie-tags nie (tensy natuurlik, wat jy probeer inspring, is 'n aanhaling!). Probeer hierdie kode in jou webblad te plaas as jy net probeer om 'n streep by te voeg:
Dit sal teks wees wat ingedruk is.
Vervolgens sal jy daardie klas teiken met 'n CSS-styl
.
vulling: 0 10px;
}
Dit voeg die 10 pixels van weiding aan weerskante van die paragraaf by.
Oorspronklike artikel deur Jennifer Krynin. Geredigeer deur Jeremy Girard op 5/8/17.