Directori d'articles
在WordPressA l'edició d'articles, hi ha un botó comú de "comitar bloc"▼
Quan s'utilitza, afegeix aMarcador per invocar alguna afirmació citada o ressaltar.
Què significa blockquote?
El següent ésChen WeiliangEstil de citació per a blocs:
L'etiqueta XHTML blockquote és un element molt útil (si està infrautilitzat).Semànticament, s'ha d'utilitzar la cita en bloc sempre que cites text més llarg d'una altra font (un altre parlant, un altre lloc web, etc.).Aquesta és una manera de delimitar el text i mostrar-lo amb altres fonts.
Pel que fa a l'estil, tot això ho pots fer amb classes especials d'etiquetes de paràgraf... però això és inútil semànticament, ara, oi? Les quotes bloc tenen alguns estils per defecte.
La majoria dels navegadors sagnen el text a les etiquetes de bloc, que ajuda els usuaris a identificar el text d'alguna manera.Però qui pot dir que hem d'aturar-nos aquí?A continuació s'explica com dissenyar els vostres blocs amb CSS.
Proveu test-css.html i afegiu la secció css al cos 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>
Com utilitzar blockquote?
S'ha trobat que alguns temes de WordPress no afegeixen estils de referència al fitxer style.css.
Copieu i enganxeu el següent estil de cantonada arrodonida de fons blau al fitxer style.css del 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;
}Els estils de referència determinen el cos del text (mida, color), el color de fons, els espais en blanc, les vores, etc.
estil de vora
Aquest estil és relativament senzill, és a dir, estableix la vora esquerra i estableix el gruix.El color controla el color de la font i el color de fons controla el color de fons (o el grup de fons directe).
El marge controla la distància a l'element de la finestra, el costat esquerre de la vora controla l'estil de la vora esquerra i el farciment (especialment el costat esquerre del farciment esquerre) controla la distància des del text fins a la vora (esquerra).
Aquest estil és tan senzill com un simple bloc.
Copieu i enganxeu l'estil de fons groc següent al fitxer style.css del tema▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Els anteriors són 2 estils de cita de bloc.
- L'addició de diversos estils idèntics se sobreescriurà.
- Per tant, trieu-ne un i afegiu-lo al fitxer style.css del tema.
Bloc d'Hope Chen Weiliang ( https://www.chenweiliang.com/ ) compartit "Com s'utilitza blockquote? HTML a l'efecte de demostració de l'etiqueta blockquote, per ajudar-vos.
Benvingut a compartir l'enllaç d'aquest article:https://www.chenweiliang.com/cwl-2123.html
Benvingut al canal de Telegram del bloc de Chen Weiliang per rebre les últimes actualitzacions!
📚 Aquesta guia té un gran valor, 🌟Aquesta és una oportunitat rara, no la perdis! ⏰⌛💨
Comparteix i m'agrada si t'agrada!
Els vostres likes i compartir són la nostra motivació contínua!