Artikkelihakemisto
在WordPressArtikkelin muokkauksessa on yleinen "block quote" -painike▼
Käytettäessä se lisää aMerkki, jolla vedetään jokin lainattu lausunto tai korostus.
Mitä blockquote tarkoittaa?
Seuraava onChen WeiliangBlogien lainaustyyli:
Blockquote XHTML -tagi on erittäin hyödyllinen (jos se on vähän käytetty) elementti.Semanttisesti blockquotea tulisi käyttää aina, kun lainaat pidempää tekstiä toisesta lähteestä (toisesta puhujasta, toiselta verkkosivustolta jne.).Tämä on tapa rajata tekstiä ja näyttää se muiden lähteiden kanssa.
Tyylillisesti voit tehdä kaiken tämän kappaletunnisteiden erikoisluokilla... mutta se on semanttisesti hyödytöntä, vai mitä? Blockquoteissa on oletuksena joitain tyylejä.
Useimmat selaimet sisentää tekstiä blockquote-tageissa, mikä auttaa käyttäjiä tunnistamaan tekstin jollain tavalla.Mutta kuka sanoo, että meidän on lopetettava tähän?Näin muotoilet lainausmerkkejäsi CSS:n avulla.
Testaa test-css.html ja lisää css-osio html-tekstiin:
<!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>
Kuinka käyttää blockquotea?
On havaittu, että jotkin WordPress-teemat eivät lisää viitetyylejä style.css-tiedostoon.
Kopioi ja liitä seuraava sinisen taustan pyöristetyn kulman tyyli teeman style.css-tiedostoon▼
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;
}Viitteetyylit määrittävät leipätekstin (koko, väri), taustavärin, välilyönnit, reunat jne...
reunatyyli
Tämä tyyli on suhteellisen yksinkertainen, eli aseta vasen reuna ja aseta paksuus.Väri ohjaa kirjasimen väriä ja taustaväri taustaväriä (tai suoraa taustaryhmää).
Reunus ohjaa etäisyyttä ikkunaelementtiin, reunuksen vasen puoli ohjaa vasemman reunan tyyliä ja täyttö (erityisesti täytetyksen vasen puoli) ohjaa etäisyyttä tekstistä (vasemmalle) reunukselle.
Tämä tyyli on yhtä yksinkertainen kuin yksinkertainen blogi.
Kopioi ja liitä seuraava keltainen taustatyyli teeman style.css-tiedostoon▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Yllä olevat ovat 2 blockquote-tyyliä.
- Useiden identtisten tyylien lisääminen korvataan.
- Valitse siis yksi niistä ja lisää se teeman style.css-tiedostoon.
Hope Chen Weiliang -blogi ( https://www.chenweiliang.com/ ) jaettu "Kuinka käyttää blockquote? HTML blockquote-tunnisteen esittelytehoste, joka auttaa sinua.
Tervetuloa jakamaan tämän artikkelin linkki:https://www.chenweiliang.com/cwl-2123.html