CSS बॉर्डर-अंत-शुरू-गोलाकार गुण

परिभाषा और उपयोग

border-end-start-radius गुण इलाका दिशा (block-end) और इन्लाइन दिशा शुरू करने के लिए प्रयोग किया जाता है।

ध्यान दें:संबंधित CSS गुण writing-mode、text-orientation और direction ब्लॉक दिशा और इन्लाइन दिशा को परिभाषित करता है।यही वजह से इन गुणों को इन गुणों पर भी प्रभाव पड़ता है border-end-start-radius गुण का परिणाम।अंग्रेजी पृष्ठ के लिए，इन्लाइन दिशा दांए से बाईं ओर की ओर है और ब्लॉक दिशा नीचे की ओर है।

यदि border-end-start-radius गुण की दो मान होने वाली तो खुराक एक अधिरेखाकार होगा:

border-end-start-radius: 50px 100px;

यदि border-end-start-radius गुण की एक मान होने वाली तो गोलाकार खुराक होगा:

border-end-start-radius: 50px;

CSS border-end-start-radius गुण और border-bottom-left-radius、border-bottom-right-radius、border-top-left-radius और border-top-right-radius गुण बहुत अधिक समान है, लेकिन border-end-start-radius गुण बॉक्स दिशा और इनलाइन दिशा पर निर्भर करता है。

उदाहरण

उदाहरण 1

कुछ तत्वों के बॉक्स के अंतिम दिशा और इनलाइन दिशा के आरंभ में कोने को गोलाकार करने के लिए:

#example1 {
  background-color: lightblue;
  border-end-start-radius: 50px;
}
#example2 {
  background-color: lightblue;
  border-end-start-radius: 50px 20px;
}
#example3 {
  background-color: lightblue;
  border-end-start-radius: 50%;
  direction: rtl;
}
#example4 {
  background-color: lightblue;
  border-end-start-radius: 50%;
  writing-mode: vertical-rl;
}

खुद अभियान करें

उदाहरण 2: direction गुण के साथ जोड़

बॉक्स के अंतिम दिशा और इनलाइन दिशा के आरंभ में कोने की स्थिति इसके प्रभाव से प्रभावित होती है。 direction गुण के प्रभाव:

#example1 {
  border: 2px solid red;
  direction: rtl;
  border-end-start-radius: 25px;
}

खुद अभियान करें

उदाहरण 3: writing-mode गुण के साथ जोड़

बॉक्स के अंतिम दिशा और इनलाइन दिशा के आरंभ में कोने की स्थिति इसके प्रभाव से प्रभावित होती है。 writing-mode गुण के प्रभाव:

#example2 {
  border: 2px solid red;
  writing-mode: vertical-rl;
  border-end-start-radius: 25px;
}

खुद अभियान करें

CSS व्याकरण

border-end-start-radius: 0|length|initial|inherit;

गुण मूल्य

तकनीकी विवरण

ब्राउज़र समर्थन

तालिका में दिए गए नंबर इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण को प्रदर्शित करते हैं。

संबंधित पृष्ठ

ट्यूटोरियल:CSS गोल-कोण

संदर्भःCSS बॉर्डर-बोट-बाएँ-दाएँ गोलाकार गुण

संदर्भःCSS बॉर्डर-बोट-दाएँ-बाएँ गोलाकार गुण

संदर्भःCSS बॉर्डर-टॉप-लेफ्ट-रेडियस प्रभाव

संदर्भःCSS बॉर्डर-टॉप-राइट-रेडियस प्रभाव

संदर्भःCSS दिशा प्रतियोगिता

संदर्भःCSS टेक्स्ट-ओरिएंटेशन अट्रिब्यूट

संदर्भःCSS वरिटिंग-मोड अट्रिब्यूट