ਬਲਾਕਕੋਟ ਦੀ ਵਰਤੋਂ ਕਿਵੇਂ ਕਰੀਏ? HTML ਬਲਾਕਕੋਟ ਟੈਗ ਡੈਮੋ ਪ੍ਰਭਾਵ

ਵਿਚਵਰਡਪਰੈਸਲੇਖ ਸੰਪਾਦਨ ਵਿੱਚ, ਇੱਕ ਆਮ "ਬਲਾਕ ਕੋਟ" ਬਟਨ ਹੈ▼

ਬਲਾਕਕੋਟ ਦੀ ਵਰਤੋਂ ਕਿਵੇਂ ਕਰੀਏ? HTML ਬਲਾਕਕੋਟ ਟੈਗ ਡੈਮੋ ਪ੍ਰਭਾਵ

ਜਦੋਂ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ, ਇਹ ਏ ਜੋੜਦਾ ਹੈਕੁਝ ਹਵਾਲਾ ਦਿੱਤੇ ਬਿਆਨ ਜਾਂ ਹਾਈਲਾਈਟ ਨੂੰ ਬੁਲਾਉਣ ਲਈ ਮਾਰਕਰ।

ਬਲਾਕਕੋਟ ਦਾ ਕੀ ਅਰਥ ਹੈ?

ਹੇਠ ਦਿੱਤੀ ਹੈਚੇਨ ਵੇਲਿਯਾਂਗਬਲੌਗ ਲਈ ਹਵਾਲਾ ਸ਼ੈਲੀ:

ਬਲਾਕਕੋਟ ਐਕਸਐਚਟੀਐਮਐਲ ਟੈਗ ਇੱਕ ਬਹੁਤ ਹੀ ਲਾਭਦਾਇਕ ਹੈ (ਜੇ ਕੁਝ ਘੱਟ ਉਪਯੋਗ ਕੀਤਾ ਗਿਆ ਹੈ) ਤੱਤ.ਸਿਮੈਂਟਿਕ ਤੌਰ 'ਤੇ, ਜਦੋਂ ਵੀ ਤੁਸੀਂ ਕਿਸੇ ਹੋਰ ਸਰੋਤ (ਕੋਈ ਹੋਰ ਸਪੀਕਰ, ਕੋਈ ਹੋਰ ਵੈਬਸਾਈਟ, ਆਦਿ) ਤੋਂ ਲੰਬੇ ਟੈਕਸਟ ਦਾ ਹਵਾਲਾ ਦਿੰਦੇ ਹੋ ਤਾਂ ਬਲਾਕਕੋਟ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਜਾਣੀ ਚਾਹੀਦੀ ਹੈ।ਇਹ ਟੈਕਸਟ ਨੂੰ ਸੀਮਤ ਕਰਨ ਅਤੇ ਇਸਨੂੰ ਹੋਰ ਸਰੋਤਾਂ ਨਾਲ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਨ ਦਾ ਇੱਕ ਤਰੀਕਾ ਹੈ।
ਸ਼ੈਲੀ ਦੇ ਅਨੁਸਾਰ, ਤੁਸੀਂ ਇਹ ਸਭ ਪੈਰਾਗ੍ਰਾਫ ਟੈਗਸ 'ਤੇ ਵਿਸ਼ੇਸ਼ ਕਲਾਸਾਂ ਨਾਲ ਕਰ ਸਕਦੇ ਹੋ... ਪਰ ਇਹ ਅਰਥਪੂਰਨ ਤੌਰ 'ਤੇ ਬੇਕਾਰ ਹੈ, ਹੁਣ, ਕੀ ਇਹ ਹੋਵੇਗਾ? ਬਲਾਕਕੋਟਸ ਵਿੱਚ ਮੂਲ ਰੂਪ ਵਿੱਚ ਕੁਝ ਸ਼ੈਲੀਆਂ ਹੁੰਦੀਆਂ ਹਨ।
ਜ਼ਿਆਦਾਤਰ ਬ੍ਰਾਊਜ਼ਰ ਬਲਾਕਕੋਟ ਟੈਗਸ ਵਿੱਚ ਟੈਕਸਟ ਨੂੰ ਇੰਡੈਂਟ ਕਰਦੇ ਹਨ, ਜੋ ਉਪਭੋਗਤਾਵਾਂ ਨੂੰ ਕਿਸੇ ਤਰੀਕੇ ਨਾਲ ਟੈਕਸਟ ਦੀ ਪਛਾਣ ਕਰਨ ਵਿੱਚ ਮਦਦ ਕਰਦਾ ਹੈ।ਪਰ ਕੌਣ ਕਹਿੰਦਾ ਹੈ ਕਿ ਸਾਨੂੰ ਉੱਥੇ ਰੁਕਣ ਦੀ ਲੋੜ ਹੈ?ਇੱਥੇ 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>

ਬਲਾਕਕੋਟ ਦੀ ਵਰਤੋਂ ਕਿਵੇਂ ਕਰੀਏ?

ਇਹ ਪਾਇਆ ਗਿਆ ਹੈ ਕਿ ਕੁਝ ਵਰਡਪਰੈਸ ਥੀਮ 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 ਟੂਲ ਵਰਤੋਂ ਗਾਈਡ" ਪ੍ਰਾਪਤ ਕਰਨ ਵਾਲੇ ਪਹਿਲੇ ਬਣੋ! 🌟
📚 ਇਸ ਗਾਈਡ ਵਿੱਚ ਬਹੁਤ ਵੱਡਾ ਮੁੱਲ ਹੈ, 🌟ਇਹ ਇੱਕ ਦੁਰਲੱਭ ਮੌਕਾ ਹੈ, ਇਸ ਨੂੰ ਨਾ ਗੁਆਓ! ⏰⌛💨
ਜੇ ਚੰਗਾ ਲੱਗੇ ਤਾਂ ਸ਼ੇਅਰ ਅਤੇ ਲਾਈਕ ਕਰੋ!
ਤੁਹਾਡੀ ਸ਼ੇਅਰਿੰਗ ਅਤੇ ਪਸੰਦ ਸਾਡੀ ਨਿਰੰਤਰ ਪ੍ਰੇਰਣਾ ਹਨ!

 

ਇੱਕ ਟਿੱਪਣੀ ਪੋਸਟ

ਤੁਹਾਡਾ ਈਮੇਲ ਪਤਾ ਪ੍ਰਕਾਸ਼ਤ ਨਹੀ ਕੀਤਾ ਜਾਵੇਗਾ. ਲੋੜੀਂਦੇ ਖੇਤਰ ਵਰਤੇ ਜਾ ਰਹੇ ਹਨ * ਲੇਬਲ

ਸਿਖਰ ਤੱਕ ਸਕ੍ਰੋਲ ਕਰੋ