CSS बॉर्डर-टॉप-राइट-रेडियस प्रॉपर्टी
उदाहरण
दो <div> तत्वों के ऊपरी-दाएँ कोने में गोल बॉर्डर जोड़ें:
#example1 {
border: 2px solid red;
border-top-right-radius: 25px;
}
#example2 {
border: 2px solid red;
border-top-right-radius: 50px
20px;
}
नीचे और अधिक "इसे स्वयं आज़माएं" उदाहरण।
परिभाषा और उपयोग
border-top-right-radius
संपत्ति ऊपरी दाएं कोने की त्रिज्या को परिभाषित करती है ।
युक्ति: यह गुण आपको तत्वों में गोल बॉर्डर जोड़ने की अनुमति देता है!
डिफ़ॉल्ट मान: | 0 |
---|---|
विरासत में मिला: | नहीं |
एनिमेटेबल: | हां। एनिमेटेबल के बारे में पढ़ें |
संस्करण: | CSS3 |
जावास्क्रिप्ट सिंटैक्स: | ऑब्जेक्ट .style.borderTopRightRadius="25px" |
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से संपत्ति का समर्थन करता है।
-वेबकिट- या -मोज़ के बाद की संख्याएं- पहले संस्करण को निर्दिष्ट करें जो उपसर्ग के साथ काम करता है।
Property | |||||
---|---|---|---|---|---|
border-top-right-radius | 5.0 4.0 -webkit- |
9.0 | 4.0 3.0 -moz- |
5.0 3.1 -webkit- |
10.5 |
सीएसएस सिंटेक्स
border-top-right-radius: length|% [length|%]|initial|inherit;
नोट: यदि आप दो मान सेट करते हैं, तो पहला शीर्ष सीमा के लिए है, और दूसरा सही सीमा के लिए है। यदि दूसरा मान छोड़ा जाता है, तो इसे पहले से कॉपी किया जाता है। यदि दोनों में से कोई भी लंबाई शून्य है, तो कोना वर्गाकार है, गोल नहीं।
सम्पत्ति की कीमत
Value | Description | Play it |
---|---|---|
length | Defines the shape of the top-right corner. Read about length units | |
% | Defines the shape of the top-right corner in % | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
और ज्यादा उदाहरण
उदाहरण
शीर्ष-दाएं कोने में गोल बॉर्डर को प्रतिशत में जोड़ें:
#example1 {
border: 2px solid red;
background: url(paper.gif);
padding: 10px;
border-top-right-radius: 40%;
}
संबंधित पृष्ठ
CSS ट्यूटोरियल: CSS राउंडेड कॉर्नर
HTML DOM संदर्भ: BorderTopRightRadius गुण