ไดเรกทอรีบทความ
在WordPressในการแก้ไขบทความ จะมีปุ่ม "ใบเสนอราคาบล็อก" ทั่วไป▼
เมื่อใช้จะเพิ่ม aเครื่องหมายเพื่อเรียกใช้คำสั่งหรือไฮไลต์ที่ยกมา
blockquote หมายถึงอะไร
ต่อไปนี้คือเฉิน เว่ยเหลียงรูปแบบการอ้างอิงสำหรับบล็อก:
แท็ก blockquote XHTML เป็นองค์ประกอบที่มีประโยชน์มาก (หากมีการใช้งานน้อยเกินไป)ในทางความหมาย ควรใช้ blockquote เมื่อใดก็ตามที่คุณอ้างอิงข้อความที่ยาวขึ้นจากแหล่งอื่น (ผู้พูดรายอื่น เว็บไซต์อื่น ฯลฯ)นี่เป็นวิธีกำหนดเขตข้อความและแสดงร่วมกับแหล่งข้อมูลอื่น
ตามรูปแบบ คุณสามารถทำทั้งหมดนี้ได้ด้วยคลาสพิเศษบนแท็กย่อหน้า... แต่นั่นไม่มีประโยชน์ทางความหมายเลยใช่ไหม Blockquotes มีสไตล์บางอย่างตามค่าเริ่มต้น
เบราว์เซอร์ส่วนใหญ่เยื้องข้อความในแท็ก blockquote ซึ่งช่วยให้ผู้ใช้ระบุข้อความได้ไม่ทางใดก็ทางหนึ่งแต่ใครจะบอกว่าเราต้องหยุดอยู่แค่นั้น?ต่อไปนี้คือวิธีจัดรูปแบบบล็อกโควตของคุณด้วย 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 ของธีม
หวัง Chen Weiliang บล็อก ( https://www.chenweiliang.com/ ) แชร์ "วิธีการใช้ blockquote? HTML ในเอฟเฟกต์การสาธิตแท็ก blockquote เพื่อช่วยคุณ
ยินดีต้อนรับสู่การแบ่งปันลิงค์ของบทความนี้:https://www.chenweiliang.com/cwl-2123.html
ยินดีต้อนรับสู่ช่อง Telegram ของบล็อกของ Chen Weiliang เพื่อรับข่าวสารล่าสุด!
📚 คู่มือนี้มีคุณค่ามหาศาล 🌟 นี่เป็นโอกาสที่หายาก อย่าพลาด! ⏰⌛💨
แชร์และชอบถ้าคุณชอบ!
การแบ่งปันและไลค์ของคุณเป็นแรงจูงใจอย่างต่อเนื่องของเรา!