Artikola Adresaro
EnWordPressEn redaktado de artikoloj, estas komuna butono "bloki citaĵo"▼
Kiam ĝi estas uzata, ĝi aldonas aMarkilo por alvoki iun cititan deklaron aŭ reliefigon.
Kion signifas blokcitaĵo?
La sekva estasChen WeiliangCitstilo por blogoj:
La blockquote XHTML-etikedo estas tre utila (se iu subuzita) elemento.Semantike, blokcitaĵo estu uzata kiam ajn vi citas pli longan tekston de alia fonto (alia parolanto, alia retejo, ktp.).Ĉi tio estas maniero limigi tekston kaj montri ĝin kun aliaj fontoj.
Stile, vi povas fari ĉion ĉi per specialaj klasoj sur alineaj etikedoj... sed tio estas semantike senutila, ĉu ne? Blokcitaĵoj havas iujn stilojn defaŭlte.
Plej multaj retumiloj indentigas tekston en blokquote-etikedoj, kio helpas uzantojn identigi la tekston iel.Sed kiu povas diri, ke ni devas halti tie?Jen kiel stiligi viajn blokcitaĵojn per CSS.
Testu test-css.html kaj aldonu la css-sekcion al la html-korpo:
<!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>
Kiel uzi blokcitaĵon?
Oni trovas, ke iuj WordPress-temoj ne aldonas referencajn stilojn en la dosiero style.css.
Kopiu kaj algluu la sekvan bluan fonan rondan angulon stilon en la style.css-dosieron de la temo▼
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;
}Referencaj stiloj determinas korptekston (grandeco, koloro), fonkoloron, blankspacon, randojn, ktp...
limstilo
Ĉi tiu stilo estas relative simpla, tio estas, starigu la maldekstran randon kaj agordu la dikecon.Koloro regas la tiparkoloron, kaj fonkoloro regas la fonkoloron (aŭ rekta fona grupo).
La marĝeno kontrolas la distancon al la fenestra elemento, la maldekstra flanko de la limo kontrolas la maldekstran randstilon, kaj la kompletigo (precipe la maldekstra flanko de la maldekstra kompletigo) kontrolas la distancon de la teksto ĝis la (maldekstra) limo.
Ĉi tiu stilo estas tiel simpla kiel simpla blogo.
Kopiu kaj algluu la sekvan flavan fonan stilon en la style.css-dosieron de la temo▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Ĉi-supraj estas 2 blokcitaj stiloj.
- Aldono de multoblaj identaj stiloj estos anstataŭita.
- Do, bonvolu elekti unu el ili kaj aldoni ĝin al la dosiero style.css de la temo.
Hope Chen Weiliang Blogo ( https://www.chenweiliang.com/ ) konigis "Kiel uzi blokcitaĵon? HTML en la blockquote etikedo demo-efiko, por helpi vin.
Bonvenon dividi la ligon de ĉi tiu artikolo:https://www.chenweiliang.com/cwl-2123.html
Bonvenon al la Telegram-kanalo de la blogo de Chen Weiliang por ricevi la plej novajn ĝisdatigojn!
📚 Ĉi tiu gvidilo enhavas grandegan valoron, 🌟Ĉi tio estas malofta ŝanco, ne maltrafu ĝin! ⏰⌛💨
Kunhavigu kaj ŝatu se vi ŝatas!
Via kundivido kaj ŝatoj estas nia kontinua instigo!