Мақала анықтамалығы
在WordPressМақаланы өңдеуде әдеттегі «цитатаны блоктау» түймесі бар▼
Қолданған кезде ол а қосадыКейбір тырнақшаға алынған мәлімдемені немесе бөлектеуді шақыру үшін маркер.
Блокцит нені білдіреді?
КелесіЧен ВэйлянБлогтар үшін дәйексөз стилі:
Blockquote XHTML тегі өте пайдалы (кейбір аз пайдаланылған болса) элемент.Басқа дереккөзден (басқа динамиктен, басқа веб-сайттан және т.Бұл мәтінді шектеу және оны басқа көздермен көрсету тәсілі.
Стиль бойынша, мұның бәрін абзац тегтеріндегі арнайы сабақтармен жасауға болады... бірақ бұл семантикалық тұрғыдан пайдасыз, солай емес пе? Blockquotes әдепкі бойынша кейбір стильдерге ие.
Көптеген браузерлер мәтінді блоктау тегтерінде шегіндіреді, бұл пайдаланушыларға мәтінді қандай да бір жолмен анықтауға көмектеседі.Бірақ біз мұнымен тоқтауымыз керек деп кім айтады?Міне, CSS көмегімен блок тырнақшаларды стильдеу жолы.
test-css.html файлын сынап көріңіз және html корпусына CSS бөлімін қосыңыз:
<!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 қалай қолданылады?
Кейбір WordPress тақырыптары style.css файлында сілтеме мәнерлерін қоспайтыны анықталды.
Келесі көк түсті фондық дөңгелектелген бұрыш мәнерін тақырыптың style.css файлына көшіріп, қойыңыз▼
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;
}Анықтама мәнерлері негізгі мәтінді (өлшем, түс), фон түсін, бос орынды, жиектерді және т.б. анықтайды...
шекаралық стиль
Бұл стиль салыстырмалы түрде қарапайым, яғни сол жақ шекараны орнатып, қалыңдығын орнатыңыз.Түс қаріп түсін басқарады, ал фон түсі фон түсін (немесе тікелей фон тобын) басқарады.
Жиек терезе элементіне дейінгі қашықтықты басқарады, жиектің сол жағы сол жақ жиек стилін басқарады, ал толтыру (әсіресе сол жақ толтырғыштың сол жағы) мәтіннен (сол жақ) шекараға дейінгі қашықтықты басқарады.
Бұл стиль қарапайым блог сияқты қарапайым.
Келесі сары фондық мәнерді тақырыптың style.css файлына көшіріп, қойыңыз▼
blockquote { margin: 1em 3em; padding: .5em 1em; border-left: 5px solid #fce27c; background-color: #f6ebc1; } blockquote p { margin: 0; }
- Жоғарыда 2 блок тырнақша стилі берілген.
- Бірнеше бірдей мәнерлер қосылса, қайта жазылады.
- Сондықтан олардың біреуін таңдап, оны тақырыптың style.css файлына қосыңыз.
Hope Chen Weiliang блогы ( https://www.chenweiliang.com/ ) бөлісті "Блоктауды қалай қолдануға болады? Сізге көмектесу үшін блок тырнақша тегінің демо әсеріндегі HTML.
Осы мақаланың сілтемесін бөлісуге қош келдіңіз:https://www.chenweiliang.com/cwl-2123.html
Соңғы жаңартуларды алу үшін Чен Вэйлян блогының Telegram арнасына қош келдіңіз!
📚 Бұл нұсқаулықта үлкен құндылық бар, 🌟Бұл сирек мүмкіндік, оны жіберіп алмаңыз! ⏰⌛💨
Ұнаса лайк басып, бөлісіңіз!
Сіздің бөлісулеріңіз бен лайктарыңыз - біздің үздіксіз мотивациямыз!