Blockquote хэрхэн ашиглах вэ? HTML blockquote хаягийн демо эффект

WordPressНийтлэл засварлахдаа нийтлэг "хашилтыг хаах" товч байдаг▼

Blockquote хэрхэн ашиглах вэ? HTML blockquote хаягийн демо эффект

Ашиглах үед энэ нь нэмдэгЗарим иш татсан мэдэгдэл эсвэл тодруулгыг дуудах тэмдэглэгээ.

блок ишлэл гэж юу гэсэн үг вэ?

Дараахь зүйл байнаЧен ВэйлянБлогын ишлэлийн хэв маяг:

Blockquote XHTML шошго нь маш хэрэгтэй (зарим ашиглаагүй бол) элемент юм.Утга зүйн хувьд, та өөр эх сурвалжаас (өөр илтгэгч, өөр вэбсайт гэх мэт) урт текстийг иш татах болгонд блок ишлэлийг ашиглах ёстой.Энэ нь текстийг хязгаарлах, бусад эх сурвалжтай харуулах арга юм.
Загварын хувьд та энэ бүгдийг догол мөрийн шошгон дээрх тусгай ангиудын тусламжтайгаар хийж болно ... гэхдээ энэ нь утга санааны хувьд ашиггүй юм, тийм үү? Blockquotes нь анхдагч байдлаар зарим загвартай байдаг.
Ихэнх хөтчид текстийг блок иш татсан шошгонд оруулдаг бөгөөд энэ нь хэрэглэгчдэд ямар нэгэн байдлаар текстийг танихад тусалдаг.Гэхдээ энд зогсох хэрэгтэй гэж хэн хэлэх вэ?CSS ашиглан блок ишлэлээ хэрхэн загварчлах талаар эндээс үзнэ үү.

test-css.html-г туршиж үзээд css хэсгийг html үндсэн хэсэгт нэмнэ үү:

<!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>

Блок ишлэлийг хэрхэн ашиглах вэ?

Зарим 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/ ) shared "Blockquote хэрхэн ашиглах вэ? Танд туслахын тулд блок ишлэл хаягийн демо эффект дэх HTML.

Энэ нийтлэлийн холбоосыг хуваалцахад тавтай морилно уу:https://www.chenweiliang.com/cwl-2123.html

Чен Вэйляны блогын Telegram сувагт тавтай морил, хамгийн сүүлийн үеийн мэдээг аваарай!

🔔 Сувгийн шилдэг лавлахаас "ChatGPT Content Marketing AI Tool Usage Guide"-г хамгийн түрүүнд аваарай! 🌟
📚 Энэхүү гарын авлага нь асар их үнэ цэнийг агуулсан, 🌟Энэ бол ховор боломж, бүү алдаарай! ⏰⌛💨
Хэрэв танд таалагдвал лайк дарж, хуваалцаарай!
Таны хуваалцах, дуртай зүйл бол бидний байнгын урам зориг юм!

 

发表 评论

Таны имэйл хаяг нийтлэгдэхгүй. 必填 项 已 用 дээр ажиллаж байна * 标注

滚动 到 顶部