Giunsa paggamit ang blockquote? HTML blockquote tag demo nga epekto

WordPressSa pag-edit sa artikulo, adunay komon nga "block quote" nga buton▼

Giunsa paggamit ang blockquote? HTML blockquote tag demo nga epekto

Kung gigamit, kini nagdugang aMarker sa pagsangpit sa pipila ka gikutlo nga pahayag o highlight.

Unsay buot ipasabot sa blockquote?

Ang mosunud mao angChen WeiliangEstilo sa citation alang sa mga blog:

Ang blockquote nga XHTML tag kay mapuslanon kaayo (kon kulang ang paggamit) nga elemento.Sa semantiko, ang blockquote kinahanglan gamiton sa matag higayon nga magkutlo ka ug mas taas nga teksto gikan sa laing tinubdan (laing mamumulong, laing website, ug uban pa).Kini usa ka paagi aron malimitahan ang teksto ug ipakita kini sa ubang mga gigikanan.
Maalamon sa istilo, mahimo nimo kining tanan gamit ang mga espesyal nga klase sa mga tag sa parapo ... apan kana wala’y kapuslanan sa semantiko, karon, mahimo ba? Ang mga blockquotes adunay pipila ka mga estilo pinaagi sa default.
Kadaghanan sa mga browser nag-indent sa teksto sa blockquote tag, nga makatabang sa mga tiggamit sa pag-ila sa teksto sa usa ka paagi.Apan kinsa ang moingon nga kita kinahanglan nga mohunong didto?Ania kung giunsa ang pag-istilo sa imong blockquotes gamit ang CSS.

Sulayi ang test-css.html ug idugang ang seksyon sa css sa html nga lawas:

<!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>

Giunsa paggamit ang blockquote?

Nakaplagan nga ang ubang mga tema sa WordPress wala magdugang ug mga estilo sa pakisayran sa style.css file.

Kopyaha ug idikit ang mosunod nga asul nga background rounded corner style ngadto sa style.css file sa theme▼

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;
}

Ang mga istilo sa pakisayran nagtino sa teksto sa lawas (gidak-on, kolor), kolor sa background, whitespace, mga utlanan, ug uban pa...

estilo sa utlanan

Kini nga estilo medyo yano, nga mao, ibutang ang wala nga utlanan ug ibutang ang gibag-on.Gikontrol sa kolor ang kolor sa font, ug ang kolor sa background nagkontrol sa kolor sa background (o direkta nga grupo sa background).

Gikontrol sa margin ang gilay-on sa elemento sa bintana, ang wala nga kilid sa utlanan nagkontrol sa estilo sa wala nga utlanan, ug ang padding (ilabi na ang wala nga bahin sa wala nga padding) nagkontrol sa distansya gikan sa teksto hangtod sa (wala) nga utlanan.

Kini nga estilo kay yano sama sa usa ka yano nga blog.

Kopyaha ug idikit ang mosunod nga dilaw nga istilo sa background sa style.css file sa tema▼

blockquote {
margin: 1em 3em;
padding: .5em 1em;
border-left: 5px solid #fce27c;
background-color: #f6ebc1; }
blockquote p {
margin: 0; }
  • Ang naa sa taas mao ang 2 nga mga istilo sa blockquote.
  • Ang pagdugang ug daghang parehas nga mga istilo ma-overwrite.
  • Busa, palihog pagpili og usa niini ug idugang kini sa style.css file sa tema.

Paglaum Chen Weiliang Blog ( https://www.chenweiliang.com/ ) mipakigbahin "Unsaon paggamit sa blockquote? HTML sa blockquote tag demo effect, aron matabangan ka.

Welcome sa pagpaambit sa link niini nga artikulo:https://www.chenweiliang.com/cwl-2123.html

Malipayon nga pag-abut sa channel sa Telegram sa blog ni Chen Weiliang aron makuha ang labing bag-ong mga update!

🔔 Mahimong una nga makakuha sa bililhon nga "ChatGPT Content Marketing AI Tool Usage Guide" sa direktoryo sa taas nga channel! 🌟
📚 Kini nga giya adunay daghang kantidad, 🌟Kini usa ka talagsaon nga oportunidad, ayaw palabya ​​kini! ⏰⌛💨
Share ug like kung ganahan ka!
Ang imong pagpaambit ug pag-like mao ang among padayon nga kadasig!

 

发表 评论

Ang imong email address dili mapatik. Gigamit ang mga kinahanglanon nga uma * Label

scroll sa ibabaw