CSS border-radius गुण
- पिछला पृष्ठ border-left-width
- अगला पृष्ठ border-right
परिभाषा और उपयोग
border-radius गुण एक संक्षिप्त गुण है जो चार border-*-radius गुणों को सेट करने के लिए उपयोग किया जाता है。
सूचना:यह गुण आपको एलिमेंट के लिए गोलाकार बॉर्डर जोड़ने की अनुमति देता है!
दूसरे देखें:
CSS3 शिक्षा:CSS3 किनारा
उदाहरण
डिव एलिमेंट को गोलाकार बॉर्डर जोड़ें:
div
{
border:2px solid;
border-radius:25px;
}
पृष्ठ के नीचे और अधिक उदाहरण हैं。
CSS व्याकरण
border-radius: 1-4 length|% / 1-4 length|%;
टिप्पणी:इस क्रम में प्रत्येक रेडियस के चार मूल्यों को सेट करें। अगर bottom-left को छोड़ दिया जाता है, तो यह top-right के समान होगा। अगर bottom-right को छोड़ दिया जाता है, तो यह top-left के समान होगा। अगर top-right को छोड़ दिया जाता है, तो यह top-left के समान होगा।
गुण मूल्य
| मूल्य | वर्णन | टेस्ट |
|---|---|---|
| length | गोलाकार कोन के आकार को परिभाषित करें。 | टेस्ट |
| % | प्रतिशत के द्वारा गोलाकार कोन के आकार को परिभाषित करें。 | टेस्ट |
उदाहरण 1
border-radius:2em;
इकवालेंट है:
border-top-left-radius:2em; border-top-right-radius:2em; border-bottom-right-radius:2em; border-bottom-left-radius:2em;
उदाहरण 2
border-radius: 2em 1em 4em / 0.5em 3em;
इकवालेंट है:
border-top-left-radius: 2em 0.5em; border-top-right-radius: 1em 3em; border-bottom-right-radius: 4em 0.5em; border-bottom-left-radius: 1em 3em;
तकनीकी विवरण
| डिफ़ॉल्ट मूल्य: | 0 |
|---|---|
| विरासत की विशेषता: | नहीं |
| संस्करण: | CSS3 |
| JavaScript व्याकरण: | object.style.borderRadius="5px" |
ब्राउज़र समर्थन
टेबल में दिए गए नंबरों में इस अभियात्मकता का पहला समर्थन करने वाला ब्राउज़र का संस्करण उल्लेख किया गया है。
| Chrome | IE / Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| 5.0 4.0 -webkit- |
9.0 | 4.0 3.0 -moz- |
5.0 3.1 -webkit- |
10.5 |
- पिछला पृष्ठ border-left-width
- अगला पृष्ठ border-right
