HTML DOM BorderTopColor प्रॉपर्टी का इस्तेमाल किसी एलीमेंट के टॉप बॉर्डर के लिए कलर पाने या सेट करने के लिए किया जाता है।
−
. के लिए वाक्य रचना निम्नलिखित हैBorderTopColor प्रॉपर्टी सेट करना -
object.style.borderTopColor ="color|transparent|initial|inherit"
उपरोक्त गुणों को इस प्रकार समझाया गया है -
| मान | <वें शैली ="पाठ-संरेखण:केंद्र;">विवरण|
|---|---|
| रंग | शीर्ष सीमा रंग निर्दिष्ट करने के लिए। इसका डिफ़ॉल्ट रंग काला पर सेट है। |
| पारदर्शी | शीर्ष बॉर्डर के रंग को पारदर्शी बनाता है और अंतर्निहित सामग्री को देखा जा सकता है। |
| प्रारंभिक | इस गुण को डिफ़ॉल्ट मान पर सेट करने के लिए। |
| उत्तराधिकारी | मूल संपत्ति मूल्य को इनहेरिट करने के लिए। |
आइए हम बॉर्डरटॉपकलर प्रॉपर्टी के लिए एक उदाहरण देखें -
उदाहरण
नीचे दिए गए बटन पर क्लिक करके उपरोक्त छवि के बॉर्डर का शीर्ष रंग बदलें
आउटपुट
“बॉर्डर का रंग बदलें . पर क्लिक करने पर "बटन -
उपरोक्त उदाहरण में -
हमने आईडी "IMG1" के साथ एक छवि तत्व बनाया है जिसमें एक सीएसएस शैली लागू है। सीएसएस शैली सीमा शीर्ष शैली और सीमा शीर्ष रंग निर्दिष्ट करती है।
#IMG1 { बॉर्डर-टॉप:सॉलिड 8px; बॉर्डर-टॉप-कलर:नारंगी;}
फिर हमने “बॉर्डर का रंग बदलें” . नाम का एक बटन बनाया जो उपयोगकर्ता द्वारा क्लिक किए जाने पर चेंजबॉर्डरटॉप () विधि को निष्पादित करेगा -
चेंजबॉर्डरटॉप () विधि getElementById () विधि का उपयोग करके आईडी "IMG1" के साथ ![]()
तत्व प्राप्त करती है और इसकी सीमा टॉपकोलर शैली की संपत्ति को नीले रंग में सेट करती है। यह शीर्ष सीमा रंग को नीले रंग में बदल देता है और इस परिवर्तन को "नमूना" आईडी के साथ अपनी आंतरिक HTML संपत्ति का उपयोग करके पैराग्राफ में प्रदर्शित करता है -
फ़ंक्शन चेंजबॉर्डरटॉप(){ document.getElementById("IMG1").style.borderTopColor="blue"; document.getElementById("Sample").innerHTML="सीमा का शीर्ष रंग अब नीला हो गया है";}