Артицле Дирецтори
ИнWordPressУ уређивању чланака постоји уобичајено дугме „блокирај цитат“▼
Када се користи, додаје аМаркер за позивање неке цитиране изјаве или истицање.
Шта значи блок цитат?
СледиЦхен ВеилиангСтил цитирања за блогове:
КСХТМЛ ознака блок цитата је веома користан (ако је неки недовољно искоришћен) елемент.Семантички, блок цитата треба користити кад год цитирате дужи текст из другог извора (другог говорника, другог веб-сајта, итд.).Ово је начин да разграничите текст и прикажете га са другим изворима.
Што се тиче стила, све ово можете да урадите са посебним класама на ознакама пасуса... али то је сада семантички бескорисно, зар не? Блоцккуотес имају неке стилове подразумевано.
Већина претраживача увлачи текст у ознаке блок цитата, што помаже корисницима да идентификују текст на неки начин.Али ко каже да ту треба да станемо?Ево како да стилизујете своје блок цитате помоћу ЦСС-а.
Тестирајте тест-цсс.хтмл и додајте цсс одељак у тело хтмл-а:
<!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>
Како користити блок цитат?
Утврђено је да неке ВордПресс теме не додају референтне стилове у датотеку стиле.цсс.
Копирајте и налепите следећи стил заобљеног угла плаве позадине у стиле.цсс датотеку теме▼
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;
}Референтни стилови одређују основни текст (величину, боју), боју позадине, размак, ивице, итд...
гранични стил
Овај стил је релативно једноставан, односно поставите леву ивицу и подесите дебљину.Боја контролише боју фонта, а боја позадине контролише боју позадине (или директну групу позадине).
Маргина контролише растојање до елемента прозора, лева страна ивице контролише стил леве ивице, а допуна (посебно лева страна допуна лево) контролише растојање од текста до (леве) ивице.
Овај стил је једноставан као обичан блог.
Копирајте и налепите следећи стил жуте позадине у стиле.цсс датотеку теме▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Горе наведена су 2 стила блок цитата.
- Додавање више идентичних стилова биће преписано.
- Дакле, изаберите једну од њих и додајте је у датотеку стиле.цсс теме.
Блог Хопе Цхен Веилианг ( https://www.chenweiliang.com/ ) дели „Како да користим блок цитат? ХТМЛ у демо ефекту ознаке блок цитата, да вам помогне.
Добродошли да поделите везу овог чланка:https://www.chenweiliang.com/cwl-2123.html
Добродошли на Телеграм канал блога Цхен Веилианг-а да бисте добили најновија ажурирања!
📚 Овај водич садржи огромну вредност, 🌟Ово је ретка прилика, не пропустите је! ⏰⌛💨
Поделите и лајкујте ако желите!
Ваше дељење и лајкови су наша стална мотивација!