बॉर्डर शॉर्टहैंड
CSS border प्रॉपर्टी किसी एलिमेंट के बॉर्डर प्रॉपर्टीज़ को परिभाषित करने के लिए उपयोग की जाती है। यह border-width, border-style, border-color का शॉर्टहैंड है। हम border-top, border-right आदि से व्यक्तिगत पक्षों को स्टाइल कर सकते हैं।
सिंटैक्स
Selector { border: /*value*/ }
उदाहरण 1
<!DOCTYPE html>
<html>
<head>
<style>
div { border-style: solid; margin: auto; padding: 5px; border-radius: 50%; }
#main { height: 100px; width: 100px; border-left: 12px ridge goldenrod; border-right: 12px ridge goldenrod; }
#main > div { line-height: 12px; height: 30px; width: 10px; padding: 27px 20px; border-top: 6px groove crimson; border-bottom: 6px ridge crimson; }
</style>
</head>
<body>
<div id="main"><div>i see you</div></div>
</body>
</html>
आउटपुट
उदाहरण 2
<!DOCTYPE html>
<html>
<head>
<style>
p { width: 60%; margin: auto; padding: 20px 45px; border-top-width: 1.4em; border-top-style: solid; border-top-color: violet; border-radius: 85px 85px 0 0; color: black; font-size: 1.3em; background-image: url("https://www.tutorialspoint.com/images/css.png"); }
</style>
</head>
<body>
<p>CSS is used to control the style of a web document in a simple way. It handles the look and feel part of a web page.</p>
</body>
</html>
आउटपुट
