Kepiye cara nggunakake blockquote? Efek demo tag blockquote HTML

Ing panyuntingan postingan WordPress , ana tombol "kutipan blokir" sing umum ▼

Nalika digunakake, nambah aMarker kanggo njaluk sawetara statement sing dipetik utawa sorotan.

Apa tegese blockquote?

Ing ngisor iki minangka gaya kutipan saka blog Chen Weiliang :

Tag blockquote XHTML minangka unsur sing migunani banget (yen ana sawetara sing kurang digunakake).Semantik, blockquote kudu digunakake nalika sampeyan ngutip teks sing luwih dawa saka sumber liya (spiker liya, situs web liyane, lsp.).Iki minangka cara kanggo mbatesi teks lan nampilake karo sumber liyane.
Gaya-wicaksana, sampeyan bisa nindakake kabeh iki karo kelas khusus ing tag paragraf ... nanging sing semantically guna, saiki, iku? Blockquotes duwe sawetara gaya minangka standar.
Umume browser indent teks ing tag blockquote, sing mbantu pangguna ngenali teks ing sawetara cara.Nanging sapa sing ngomong yen kita kudu mandheg?Mangkene carane nggawe gaya blockquotes nganggo CSS.

Tes test-css.html lan tambahake bagean css menyang awak html:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-us">
<head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Test CSS blockquote</title>
</head>
<blockquote>
  <p>The blockquote XHTML tag is a fairly useful (if somewhat underused) element. Semantically speaking, a blockquote should be used any time you’re quoting a longer piece of text from another source – another speaker, another website, whatever. It’s a way of setting the text apart, and showing that it came from some other source. Stylistically, you could accomplish all this with a special class on your paragraph tags… but that wouldn’t be as semantically useful, now, would it?<br>
  Blockquotes do have some styling by default. Most browsers will indent the text in a blockquote tag, which helps the user recognize that the text is different somehow. But who's to say that we need to stop there? Here are six different ways you could style your blockquotes using CSS.</p>
</blockquote>
</body>
</html>

Kepiye cara nggunakake blockquote?

Ditemokake manawa sawetara tema WordPress ora nambah gaya referensi ing file style.css.

Salin lan tempel gaya sudhut bunder latar mburi biru ing ngisor iki menyang file style.css tema▼

blockquote, q {
    font: bold 21px/1.5 Consolas,"Courier New","KaiTi","KaiTi_GB2312","FangSong_GB2312",SimHei,arial,Monaco,monospace;
    color: #000;
    margin: 1em;
    margin-left: 2em;
    margin-right: 2em;
    padding: 3px;
    max-width: 95%;
    quotes: "\201C""\201D""\2018""\2019";
    background: #C3F3F7;
    border-radius: 20px;
}

Gaya referensi nemtokake teks awak (ukuran, warna), warna latar mburi, spasi putih, wates, lsp...

gaya wates

Gaya iki relatif prasaja, yaiku, nyetel wates kiwa lan nyetel kekandelan.Werna ngontrol werna font, lan werna latar mburi ngontrol werna latar mburi (utawa grup latar mburi langsung).

Margin kontrol kadohan kanggo unsur jendhela, sisih kiwa wewatesan kontrol gaya wewatesan kiwa, lan padding (utamané sisih kiwa padding kiwa) kontrol kadohan saka teks kanggo (kiwa) wates.

Gaya iki prasaja kaya blog sing prasaja.

Salin lan tempel gaya latar mburi kuning ing ngisor iki menyang file style.css tema▼

blockquote {
margin: 1em 3em;
padding: .5em 1em;
border-left: 5px solid #fce27c;
background-color: #f6ebc1; }
blockquote p {
margin: 0; }

• Ing ndhuwur ana 2 gaya blockquote.
• Nambahake macem-macem gaya sing padha bakal ditimpa.
• Dadi, pilih salah siji lan tambahake menyang file style.css tema.