 |
| HTML and CSS tutorial for beginners in Hindi |
हेलो फ्रेंड्स, KTL के HTML और CSS tutorial में फिर स्वागत है। आज हम लेसन ३१ सीखेंगे।
पिछले लेसन में हम ने CSS margins के बारे में सीखा।
आज हम CSS Outline के बारे में सीखेंगे।
CSS Outline property in Hindi
Outline बॉर्डर के बाहर निकली हुई एक लाइन होती है। यह बॉर्डर नहीं होती है। Outline दिखाने से वह element वेब पेज में उभर के दिखता है, highlight हो जाता है।हम एक outline डिस्प्ले करेंगे और देखेंगे की वह कैसी दिखती है।
Notepad में एक नयी फाइल ओपन कीजिये। इस में lesson 30 का कोड कॉपी कीजिये। हम header को outline डिस्प्ले करेंगे। इस के लिए #header में यह लाइन इन्सर्ट कीजिये।
outline: 0.3vw solid green;
 |
| आकृति ३१-१ CSS outline property |
इस source कोड की PDF फाइल देखने के लिए आकृति ३१-१ पर क्लिक कीजिये। इस फाइल को "Lesson-31" और "Lesson-31.html" के नाम से save कीजिये। Windows explorer में जाइये और HTML फाइल पर डबल क्लिक कीजिये। आउटपुट देखिये।
यह आउटपुट नए वेब पेज में देखने के लिए निचे डिस्प्ले की हुई आकृति पर क्लिक कीजिये।
 |
| आकृति ३१-२ CSS outline property |
Header के बॉर्डर को एक हरी रंग की outline आ गयी है। आप shadow में और outline में का फरक समझ लीजिये।
ध्यान दीजिये की outline property और border property के syntax एक जैसे है - 0.3vw solid red;। या
outline: width style color;
होती है।
CSS Outline-width property, CSS Outline-color property, CSS Outline-style property
Outline डिस्प्ले करने के लिए भी अलग अलग प्रॉपर्टीज होती है, जैसे outline-width, outline-style, और outline-color।
आप जानते हैं की हम कलर देने के लिए कलर का नाम, rgb function, या hexadecimal का उपयोग कर सकते हैं।
स्टाइल solid, dashed, dotted वगैरह हो सकती है।
Width के लिए length के units का उपयोग करते हैं। हम इस के लिए thin, medium, and thick values का उपयोग कर सकते हैं।
Important Points:
१. CSS outline का उपयोग element का outline डिस्प्ले करने के लिए होता है।२. Border property की तरह इस में भी width, style और color देना पड़ता है।
३. इन के लिए हम अलग अलग प्रॉपर्टीज दे सकते हैं जैसे outline-width, outline-style, और outline-color।
लेसन ३० लेसन ३२
