CSS text-decoration property - ldkalink
CSS text-decoration property क्या है
जब हमें किसी टेक्स्ट को स्टाइलिश बनाना होता है तब हम सीएसएस प्रॉपर्टी के अंतर्गत text-decoration का उपयोग करते हैं ।
अब टेक्स्ट डेकोरेशन का उपयोग कैसे किया जाता है किस तरह से इसका यूज़ किया जाता है, तो इसके बारे में आज हम इस आर्टिकल में विस्तार से जाने वाले हैं।
माना की www.ldkalink.com पर कोई एक पोस्ट SEO से संबंधित है जिसके अन्दर कई सारे हेडिंग हैं जैसे की h1, h2, h3 h4 जनरली आपने भी कभी नोटिस किया होगा कि जब भी हम कोई पैराग्राफ पढ़ते हैं या फिर कोई नेट पर आर्टिकल पड़ते हैं तो उसके अंतर्गत कई सारे हेडिंग दिखाई देते हैं और इन हेडिंग को यदि हम अलग-अलग अपने वेब पेज में स्टाइलिश रूप में दिखाना चाहे तो इसके लिए हम CSS text-decoration property का use करते हैं।
उदाहरण (Example)
आप देख सकते हैं <H1> <H2> <H3> <H4> एलिमेंट्स के लिए टेक्स्ट डेकोरेट को हम अलग-अलग तरीके से सेट कर सकते हैं
h1 {text-decoration: overline;}h2 {text-decoration: line-through;}h3 {text-decoration: underline;}h4 {text-decoration: underline overline;}
- text-decoration: overline - यह टेक्स्ट के ऊपर एक लाइन क्रिएट करता है।
- text-decoration: line-through - जब हम कोई टेस्ट लिखते हैं और हम चाहते हैं कि इसके बीच में एक लाइन क्रिएट हो, यानी यह टेक्स्ट कटा हुआ दिखाई दे तो इसके लिए हम इसका उपयोग करते हैं।
- text-decoration: under-line - जब कभी हम टेक्स्ट के नीचे लाइन क्रिएट करना चाहते हैं तो इसके लिए हम इसका उपयोग करते हैं।
- text-decoration: underline overline - टेक्स्ट के ऊपर तथा नीचे दोनों ओर एक लाइन क्रिएट करने के लिए इस प्रॉपर्टी का यूज़ किया जाता है।
परिभाषा (definition) और उपयोग (Usage)
इस text-decoration का उपयोग हम तब करते हैं जब हम चाहते हैं कि किसी वेबसाइट वेब वेब पेज में किसी टेक्स्ट को डेकोरेट करना है यानी इसे हम अपने तरीके से अपनी जरूरत के मुताबिक इसे अलग लुक देना चाहते हैं।
- text-decoration-line (required)
- text-decoration-color
- text-decoration-style
- text-decoration-thickness
CSS Syntax
text-decoration: text-decoration-line text-decoration-color text-decoration-styletext-decoration-thickness|initial|inherit;
उदाहरण
h1 {text-decoration: underline overline dotted blue;}
ऊपर किया गया कोड टेस्ट के ऊपर नीचे डॉटेड लाइन क्रिएट करेगा जो की नीला कलर में शो होगा।