د بلاک کوټ کارولو څرنګوالی؟ د HTML بلاککوټ ټګ ډیمو اغیزه

پهWordPressد مقالې په سمون کې، یو عام "بلاک اقتباس" تڼۍ شتون لري▼

د بلاک کوټ کارولو څرنګوالی؟ د HTML بلاککوټ ټګ ډیمو اغیزه

کله چې کارول کیږي، دا اضافه کوي aمارکر د ځینې نقل شوي بیان یا روښانه کولو غوښتنه کوي.

د بلاک اقتباس څه معنی لري؟

لاندې دیچن ویلینګد بلاګونو لپاره د حوالې سټایل:

د بلاک کوټ ایکس ایچ ٹی ایم ایل ټګ خورا ګټور عنصر دی (که ځینې لږ کارول شوي وي).په معنی توګه، د بلاک اقتباس باید وکارول شي کله چې تاسو د بلې سرچینې څخه اوږد متن نقل کوئ (بل سپیکر، بله ویب پاڼه، او نور).دا د متن محدودولو او د نورو سرچینو سره ښودلو یوه لاره ده.
د سټایل له مخې، تاسو کولی شئ دا ټول د پراګراف ټګونو کې د ځانګړي ټولګیو سره ترسره کړئ ... مګر دا په معنی توګه بې ګټې دی، اوس، ایا دا به وي؟ بلاک کوټونه د ډیفالټ لخوا ځینې سټایلونه لري.
ډیری براوزرونه په بلاک کوټ ټګونو کې متن انډیټ کوي ، کوم چې کاروونکو سره مرسته کوي متن په یو ډول وپیژني.مګر څوک باید ووایی چې موږ باید هلته ودریږو؟دلته د CSS سره ستاسو د بلاک کوټونو سټایل کولو څرنګوالی دی.

test-css.html ازموینه وکړئ او د 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>

د بلاک کوټ کارولو څرنګوالی؟

دا وموندل شوه چې ځینې ورڈپریس موضوعات د 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 فایل کې یې اضافه کړئ.

امید چن وییلینګ بلاګ ( https://www.chenweiliang.com/ ) شریک کړل "څنګه د بلاک کوټ کارول؟ HTML د بلاککوټ ټګ ډیمو اثر کې، ستاسو سره د مرستې لپاره.

د دې مقالې لینک شریکولو ته ښه راغلاست:https://www.chenweiliang.com/cwl-2123.html

د وروستي تازه معلوماتو ترلاسه کولو لپاره د چن ویلیانګ بلاګ ټیلیګرام چینل ته ښه راغلاست!

🔔 د چینل غوره لارښود کې د ارزښتناکه "ChatGPT مینځپانګې بازار موندنې AI وسیلې کارولو لارښود" ترلاسه کولو لپاره لومړی اوسئ! 🌟
📚 دا لارښود لوی ارزښت لري، 🌟دا یو نادر فرصت دی، له لاسه مه ورکوئ! ⏰⌛💨
که مو خوښه شوه لایک او شریک کړئ!
ستاسو شریکول او خوښول زموږ دوامداره هڅونه ده!

 

评论 评论

ستاسو د بریښنالیک آدرس به نشر نشي اړین ساحې کارول کیږي * لیبل

پورته ته سکرول