Unsa ang usa ka Blockquote?

Kon nakatan-aw ka sa listahan sa mga elemento sa HTML, tingali nakaplagan nimo ang imong kaugalingon nga nangutana "unsa ang usa ka blockquote?" Ang elemento sa blockquote usa ka tag sa tag sa HTML nga gigamit sa paghubit sa taas nga mga kinutlo. Ania ang kahulogan niini nga elemento sumala sa paghulagway sa W3C HTML5:

Ang elemento sa blockquote nagrepresentar sa usa ka seksyon nga gikutlo gikan sa lain nga tinubdan.

Unsaon Paggamit Blockquote sa Imong mga Webpage

Sa dihang nagsulat ka og teksto sa usa ka web page ug paghimo sa layout sa pahina, usahay gusto nimo nga tawagon ang usa ka block sa teksto ingon nga usa ka kinutlo.

Mahimo kini nga kinutlo gikan sa laing dapit, sama sa testimonial sa mga customer nga nag-uban sa usa ka case study o proyekto nga kalampusan nga istorya. Mahimo usab kini usa ka disenyo nga pagtambal nga nagsubli sa pipila ka mahinungdanong teksto gikan sa artikulo o sulod mismo. Diha sa pagmantala, usahay kini gitawag nga pull-quote , Sa design sa web, usa sa mga paagi aron makab-ot kini (ug ang paagi nga atong gitabonan niini nga artikulo) gitawag nga blockquote.

Busa atong tan-awon kung unsaon nimo gamiton ang tag sa blockquote aron mahibal-an ang taas nga mga kinutlo, sama sa kutay gikan sa "The Jabberwocky" ni Lewis Carroll:

'Ang twas brillig ug ang slithey toves
Gisulayan ug gimble sa wabe:
Ang tanan nga mimsy mao ang mga borogoves,
Ug ang mome raths outgrabe.

(ni Lewis Carroll)

Pananglitan sa Paggamit sa Blockquote Tag

Ang blockquote tag usa ka semantic tag nga nagsulti sa browser o user agent nga ang mga sulod usa ka taas nga kinutlo. Sa ingon, dili ka kinahanglan nga maglakip sa teksto nga dili usa ka kinutlo sulod sa blockquote tag.Hinumdumi, ang usa ka "kinutlo" sa kasagaran tinuod nga mga pulong nga gisulti o gisulti sa usa ka tawo gikan sa gawas nga tinubdan (sama sa Lewis Carroll nga teksto niini nga artikulo), apan kini mahimo usab nga konsepto sa pullquote nga atong gisakup kaniadto.

Sa diha nga ikaw naghunahuna mahitungod niini, kana nga pullquote usa ka kinutlo sa teksto, kini mahitabo nga gikan sa samang artikulo nga ang kutlo mismo makita.

Kadaghanan sa mga web browser nagdugang sa pipila ka mga indenting (mga 5 ka mga luna) sa duha ka mga kilid sa usa ka blockquote aron kini makapahayag gikan sa kasikbit nga teksto. Ang uban nga mga daan na nga daan nga mga browser mahimo pa gani makahatag sa gikutlo nga teksto sa italics.

Hinumdomi nga kini mao ang simple nga estilo sa elemento sa blockquote. Uban sa CSS, ikaw adunay bug-os nga pagkontrol kung unsaon ipakita sa imong blockquote. Mahimo mo madugangan o kuhaon pa ang indent, idugang ang mga kolor sa background o usbaw ang gidak-on sa teksto aron dugang nga isulti ang kinutlo. Mahimo nimong ipasabot ang pagkutlo sa usa ka bahin sa panid ug ipapilit ang laing teksto sa palibot niini, nga usa ka kasagarang biswal nga estilo nga gigamit alang sa mga pullquotes sa naimprinta nga mga magasin. Imong gikontrol ang panagway sa blockquote sa CSS, usa ka butang nga atong hisgutan sa diyutay pa nga panahon. Sa karon, magpadayon kita sa pagtan-aw unsaon sa pagdugang sa kinutlo mismo sa imong markup sa HTML.

Aron idugang ang tag sa blockquote sa imong teksto, palibut lamang ang teksto nga usa ka kinutlo uban sa mosunod nga pares sa tag -

Pananglitan:


'Ang twas brillig ug ang slithey toves

Gisulayan ug gimble sa wabe:

Ang tanan nga mimsy mao ang mga borogoves,

Ug ang mome raths outgrabe.

Sama sa imong makita, imong idugang ang pares nga blockquote tags sa palibot sa sulod sa kinutlo mismo. Sa niini nga panig-ingnan, gigamit usab namo ang pipila ka mga tags (
) aron makadugang sa usa ka linugdangan sa linya diin angay sa sulod sa teksto. Kini tungod kay kita nagmugna og teksto gikan sa usa ka balak, diin ang mga espesipikong mga pahulay importante. Kung ang imong pagmugna usa ka testimonial quote sa customer, ug ang mga linya wala magkinahanglan nga makaguba sa mga espesipikong mga bahin, dili nimo gusto nga idugang kini nga mga tag sa break ug tugutan ang browser nga mabaligya ug mabuak kung gikinahanglan base sa gidak-on sa screen.

Ayaw Paggamit Blockquote sa Indent Text

Sulod sa daghang katuigan, gigamit sa mga tawo ang blockquote tag kon gusto nila ang indent text sa ilang webpage, bisan kung ang maong teksto dili usa ka pullquote. Kini usa ka dili maayong buhat! Dili nimo gusto nga gamiton ang mga semantiko sa blockquote alang lamang sa biswal nga mga hinungdan. Kung gikinahanglan nimo ang pag-indent sa imong teksto, kinahanglang gamiton nimo ang style sheets, dili ang blockquote tags (gawas kon, siyempre, unsa ang imong gisulayan nga indent usa ka kinutlo!). Sulayi ang pagbutang niini nga kodigo sa imong web page kung ikaw naningkamot nga makadugang usa ka indent:

Kini mahimong teksto nga nakasulod.

Sunod, imong itarget kana nga klase sa estilo sa CSS

.indented {
padding: 0 10px;
}

Kini nagdugang sa 10 ka pixel sa padding sa matag kilid sa parapo.

Ang orihinal nga artikulo ni Jennifer Krynin. Gipamod ni Jeremy Girard sa 5/8/17.