Artikelkatalog
ihood.discountI artikelredigering finns en vanlig "blockcitat"-knapp▼
När den används lägger den till enMarkör för att åberopa något citerat uttalande eller markering.
Vad betyder blockquote?
Följande ärChen WeiliangCitatstil för bloggar:
Blockquote XHTML-taggen är ett mycket användbart (om något underutnyttjat) element.Semantiskt sett bör blockquote användas när du citerar längre text från en annan källa (en annan talare, en annan webbplats, etc.).Detta är ett sätt att avgränsa text och visa den med andra källor.
Stilmässigt kan du göra allt detta med specialklasser på stycketaggar... men det är semantiskt värdelöst, nu, eller hur? Blockcitat har vissa stilar som standard.
De flesta webbläsare drar in text i blockquote-taggar, vilket hjälper användare att identifiera texten på något sätt.Men vem säger att vi måste sluta där?Så här stylar du dina blockcitat med CSS.
Testa test-css.html och lägg till css-avsnittet i html-kroppen:
<!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>
Hur använder man blockquote?
Det har visat sig att vissa WordPress-teman inte lägger till referensstilar i filen style.css.
Kopiera och klistra in följande rundade hörnstil med blå bakgrund i filen style.css för temat▼
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;
}Referensstilar bestämmer brödtext (storlek, färg), bakgrundsfärg, blanksteg, kanter, etc...
kantstil
Denna stil är relativt enkel, det vill säga ställ in den vänstra kanten och ställ in tjockleken.Färg styr teckensnittsfärgen och bakgrundsfärg styr bakgrundsfärgen (eller direkt bakgrundsgrupp).
Marginalen styr avståndet till fönsterelementet, den vänstra sidan av kanten styr den vänstra kantlinjen, och utfyllnaden (särskilt den vänstra sidan av utfyllnaden till vänster) styr avståndet från texten till (vänster) kantlinjen.
Den här stilen är lika enkel som en enkel blogg.
Kopiera och klistra in följande gula bakgrundsstil i filen style.css för temat▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Ovanstående är 2 blockcitatstilar.
- Att lägga till flera identiska stilar kommer att skrivas över.
- Så välj en av dem och lägg till den i temats style.css-fil.
Hope Chen Weiliang blogg ( https://www.chenweiliang.com/ ) delade "Hur använder man blockquote? HTML i blockquote-taggen demoeffekt, för att hjälpa dig.
Välkommen att dela länken till denna artikel:https://www.chenweiliang.com/cwl-2123.html