Nola erabili blockquote? HTML blockquote etiketa demo efektua

WordPressArtikuluen edizioan, "blokeatu komatxo" botoi arrunt bat dago▼

Nola erabili blockquote? HTML blockquote etiketa demo efektua

Erabiltzen denean, a gehitzen duAdierazitako adierazpen edo nabarmentze batzuk deitzeko markatzailea.

Zer esan nahi du blockquote?

Honako hau daChen WeiliangBlogetarako aipamen estiloa:

Blockquote XHTML etiketa oso elementu erabilgarria da (batzuk gutxiegi erabiltzen badira).Semantikoki, blockquote erabili behar da beste iturri bateko testu luzeagoa aipatzen duzun bakoitzean (beste hizlari bat, beste webgune bat, etab.).Hau testua mugatzeko eta beste iturri batzuekin bistaratzeko modu bat da.
Estiloari dagokionez, hori guztia egin dezakezu paragrafo-etiketetan klase bereziekin... baina hori semantikoki alferrikakoa da, orain, ezta? Blokeko komatxoek estilo batzuk dituzte lehenespenez.
Arakatzaile gehienek testua koska egiten dute blockquote etiketetan, eta horrek erabiltzaileei testua nolabait identifikatzen laguntzen die.Baina nork esango du hor gelditu behar dugula?Hona hemen zure blokeko komatxoak CSS-ekin estiloa nola jarri.

Probatu test-css.html eta gehitu css atala html gorputzean:

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

Nola erabili blockquote?

Ikusten da WordPress-eko gai batzuek ez dutela erreferentzia-estilorik gehitzen style.css fitxategian.

Kopiatu eta itsatsi hurrengo atzeko plano urdineko izkina biribildutako estiloa gaiaren style.css fitxategian▼

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

Erreferentzia-estiloek gorputz-testua (tamaina, kolorea), atzeko planoaren kolorea, zuriuneak, ertzak eta abar zehazten dute.

muga estiloa

Estilo hau nahiko erraza da, hau da, ezarri ezkerreko ertza eta ezarri lodiera.Koloreak letra-tipoaren kolorea kontrolatzen du eta atzeko planoaren koloreak atzeko planoaren kolorea (edo atzeko plano zuzeneko taldea).

Marjinak leiho-elementuarekiko distantzia kontrolatzen du, ertzaren ezkerreak ezkerreko ertzaren estiloa kontrolatzen du eta betegarriak (batez ere ezkerreko betegarriaren ezkerraldea) testutik (ezkerreko) ertzerainoko distantzia kontrolatzen du.

Estilo hau blog sinple bat bezain sinplea da.

Kopiatu eta itsatsi hurrengo atzeko plano horia gaiaren style.css fitxategian▼

blockquote {
margin: 1em 3em;
padding: .5em 1em;
border-left: 5px solid #fce27c;
background-color: #f6ebc1; }
blockquote p {
margin: 0; }
  • Goiko hauek 2 blockquote estilo dira.
  • Hainbat estilo berdin gehitzea gainidatzi egingo da.
  • Beraz, mesedez aukeratu horietako bat eta gehitu gaiaren style.css fitxategira.

Hope Chen Weiliang bloga ( https://www.chenweiliang.com/ ) partekatu du "Nola erabili blockquote? HTML blockquote etiketa demo efektuan, zuri laguntzeko.

Ongi etorri artikulu honen esteka partekatzera:https://www.chenweiliang.com/cwl-2123.html

Ongi etorri Chen Weiliang-en blogeko Telegram kanalera azken eguneraketak jasotzeko!

🔔 Izan zaitez kanalaren goiko direktorioan "ChatGPT Content Marketing AI Tool Erabilera Gida" baliotsua lortzen lehena! 🌟
📚 Gida honek balio handia du, 🌟Aukera arraroa da hau, ez galdu! ⏰⌛💨
Partekatu eta gustatzen bazaizu!
Zure partekatzea eta gustukoak dira gure etengabeko motibazioa!

 

发表 评论

Zure helbide elektronikoa ez da argitaratuko. 必填 项 已 用 * 标注

joan goian