在የዎርድፕረስበአንቀፅ አርትዖት ውስጥ፣ የተለመደ የ"ብሎክ ጥቅስ" ቁልፍ አለ▼
ጥቅም ላይ ሲውል ሀአንዳንድ የተጠቀሰ መግለጫ ወይም ድምቀት ለመጥራት ምልክት ማድረጊያ።
blockquote ማለት ምን ማለት ነው?
የሚከተለው ነውChen Weiliangለብሎግ የጥቅስ ዘይቤ፡-
የ blockquote XHTML መለያ በጣም ጠቃሚ (አንዳንድ ጥቅም ላይ ካልዋለ) አካል ነው።በትርጉም ደረጃ፣ ከሌላ ምንጭ (ሌላ ተናጋሪ፣ ሌላ ድረ-ገጽ፣ ወዘተ) ረዘም ያለ ጽሑፍ በሚጠቅሱበት ጊዜ ሁሉ blockquote ጥቅም ላይ መዋል አለበት።ይህ ጽሑፍን ለመገደብ እና ከሌሎች ምንጮች ጋር ለማሳየት የሚያስችል መንገድ ነው.
ቅጥ-ጥበበኛ፣ ይህንን ሁሉ በልዩ ክፍሎች በአንቀጽ መለያዎች ማድረግ ይችላሉ… ግን ያ በትርጉም ደረጃ ምንም ፋይዳ የለውም ፣ አሁንስ? 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>
blockquote እንዴት መጠቀም እንደሚቻል?
አንዳንድ የዎርድፕረስ ገጽታዎች በ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 blockquote styles ናቸው።
- ብዙ ተመሳሳይ ዘይቤዎችን ማከል እንደገና ይፃፋል።
- ስለዚህ፣ እባክዎ ከመካከላቸው አንዱን ይምረጡ እና ወደ የገጽታ style.css ፋይል ያክሉት።
ተስፋ Chen Weiliang ብሎግ ( https://www.chenweiliang.com/ ) የተጋራ " blockquote እንዴት መጠቀም ይቻላል? ኤችቲኤምኤል እርስዎን ለማገዝ በ blockquote tag demo effect ውስጥ።
እንኳን በደህና መጡ የዚህን ጽሁፍ ማገናኛ ለማጋራት፡-https://www.chenweiliang.com/cwl-2123.html
አዳዲስ መረጃዎችን ለማግኘት ወደ የቼን ዌይሊያንግ ብሎግ የቴሌግራም ቻናል እንኳን በደህና መጡ።
📚 ይህ መመሪያ ትልቅ ዋጋ አለው፣ 🌟ይህ ያልተለመደ እድል ነው፣ እንዳያመልጥዎ! ⏰⌛💨
ከወደዳችሁት ሼር እና ላይክ አድርጉ!
የእርስዎ ማጋራት እና መውደዶች ቀጣይ ማበረታቻዎቻችን ናቸው!