Yen sampeyan wis tau nemokake daftar unsur HTML, sampeyan bisa nemokake dhewe takon "apa blockquote?" Unsur blockquote yaiku pasangan tag HTML sing digunakake kanggo netepake kutipan dawa. Punika definisi unsur iki miturut spesifikasi W3C HTML5:
Unsur blockquote nggambarake bagean sing dipetik saka sumber liyane.
Cara Nganggo Blockquote ing Panjenengan Webpages
Nalika sampeyan nulis teks ing kaca web lan nggawe tata letak kaca, sampeyan sok-sok pengin nyebat blok teks minangka kutipan.
Iki bisa dadi kutipan saka ngendi wae, kaya testimoni pelanggan sing ngiringi studi kasus utawa kisah sukses proyek. Iki uga minangka perawatan desain sing ngulang sawetara teks penting saka artikel utawa isi kasebut. Ing penerbitan, iki kadhangkala disebut tembung tarik , Ing desain web, salah sawijining cara kanggo entuk iki (lan cara sing kita panutup ing artikel iki) disebut blockquote.
Mulane, goleki carane nggunakake tag blockquote kanggo nemtokake kutipan panjang, kayata kutipan saka "The Jabberwocky" dening Lewis Carroll:
'Twas brillig lan tofu slithey
Dadi gerah lan gimble ing wabe:
Kabeh mimsy yaiku borogoves,
Lan mumet banget.
(dening Lewis Carroll)
Conto Nggunakake Tag Blockquote
Tag blockquote minangka tag semantic sing ngandhani browser utawa panganggo sing isi isine kutipan. Dadi, sampeyan kudu ora nglebokke teks sing ora ditulis ing tag blockquote. Nanging, "kutipan" asring asale tembung-tembung sing ditulisake wong utawa teks saka sumber njaba (kaya teks Lewis Carroll ing artikel iki), nanging Bisa uga konsep pullquote sing dicakup sadurunge.
Nalika sampeyan mikir bab iku, sing pullquote minangka Kutipan teks, mung kaya saka ing artikel sing padha supaya kutipan dhewe katon ing.
Paling browser web nambahake indentasi (kira-kira 5 spasi) kanggo loro sisi blockquote kanggo nggawe metu saka teks lingkungan. Sawetara browser lawas banget bisa uga nulis teks sing dicutat ing miring.
Elinga yen iki mung gaya standar unsur blockquote. Kanthi CSS, sampeyan duwe kontrol total babagan carane blockquote sampeyan bakal nampilake. Sampeyan bisa nambah utawa malah nyopot inden, nambah werna latar mburi utawa nambah ukuran teks kanggo luwih nelpon panutan. Sampeyan bisa ngambangake kutipan kasebut menyang sisih pinggir kaca lan mbungkusen teks liyane, sing gaya umum sing digunakake kanggo tarik-menarik ing majalah sing dicithak. Sampeyan duwe kontrol babagan tampilan blockquote karo CSS, soko kita bakal mbahas luwih cepet sakcepete. Saiki, ayo terus ndeleng cara nambahake kutipan kasebut marang markup HTML.
Kanggo nambah tag blockquote ing teks sampeyan, mung ngubengi teks sing minangka kutipan karo pasangan tag ing ngisor iki -
Tuladhane:
'Twas brillig lan tofu slithey
Dadi gerah lan gimble ing wabe:
Kabeh mimsy yaiku borogoves,
Lan mumet banget.
Minangka sampeyan bisa ndeleng, sampeyan mung nambahake tag blockquote sak isi kutipan kasebut dhewe. Ing conto iki, kita uga nggunakake sawetara tag break (
) kanggo nambah baris siji baris sing cocok ing jero teks. Iki amarga kita nggawé ulang teks saka puisi, ing ngendi sing pecah tartamtu iku penting. Yen sampeyan nggawe kuotasi testimoni pelanggan, lan garis ora perlu ngilangi bagean tartamtu, sampeyan ora pengin nambah tag break iki lan ngidini browser dhewe mbungkus lan istirahat kaya sing perlu adhedhasar ukuran layar.
Aja Gunakake Blockquote kanggo Teks Indent
Kanggo pirang-pirang taun, wong nggunakake tag blockquote yen padha pengin nggawe teks ing kaca web, sanajan teks kasebut ora minangka pullquote. Iki minangka laku ala! Sampeyan ora pengin nggunakake semangat blockquote namung kanggo alasan visual. Yen sampeyan pengin indent teks, sampeyan kudu nggunakake sheet style, ora tag blockquote (kajaba, mesthi, apa sing nyoba kanggo indent punika Kutipan!). Coba tulis kode iki ing kaca web sampeyan yen sampeyan mung nyoba nambahake indent:
Iki bakal dadi teks sing ana gandheng ceneng.
Sabanjure, sampeyan bakal nemtokake kelas kasebut nganggo gaya CSS
.inden {
padding: 0 10px;
}
Iki nambahake 10 piksel padding ing salah siji sisi paragraf.
Artikel asli dening Jennifer Krynin. Diedit dening Jeremy Girard ing 5/8/17.