CSS border-color प्रॉपर्टी का उपयोग एलिमेंट्स के लिए बॉर्डर कलर स्पेसिफाई करने के लिए किया जाता है। हम border-top-color, border-right-color, border-left-color और border-right-color प्रॉपर्टीज़ का उपयोग करके इंडिविजुअल साइड्स के लिए कलर भी सेट कर सकते हैं।
सिंटैक्स
CSS border-color प्रॉपर्टी का सिंटैक्स निम्नलिखित है:
Selector { border-color: /*value*/ }निम्नलिखित उदाहरण CSS border-color प्रॉपर्टी को दर्शाते हैं:
उदाहरण
<!DOCTYPE html> <html> <head> <style> span { margin: 10px; padding: 20px; border-style: solid; border-color: limegreen lightblue crimson; } div { text-align: center; border-style: solid; border-color: palevioletred steelblue; height: 16px; } </style> </head> <body> <h2>Demo Heading</h2> <div>Demo</div> <p><span>This</span>is demo text just for displaying how CSS styles works.</p> </body> </html>आउटपुट
यह निम्नलिखित आउटपुट देता है:
उदाहरण
<!DOCTYPE html> <html> <head> <style> li { border-bottom-color: cyan; border-bottom-style: dotted; width: 300px; } p { text-align: center; border-width: 8px; border-style: solid; border-color: #d11c74; border-left-style: ridge; } </style> </head> <body> <h2>Accessories</h2> <p>Displaying the car accessories</p> <ul> <li>Mud Flap</li> <li>Car Freshener</li> <li>Mobile Holder</li> <li>Bluetooth</li> <li>Wheel Lock</li> </ul> </body> </html>आउटपुट
यह निम्नलिखित आउटपुट देता है:
