Question 1

border-radius के साथ परफेक्ट सर्कल कैसे बनाएं?

Accepted Answer

वर्गाकार एलिमेंट (समान चौड़ाई और ऊंचाई) पर border-radius को 50% पर सेट करें। यह आकार की परवाह किए बिना एक परफेक्ट सर्कल बनाता है। आयतों के लिए, 50% एक दीर्घवृत्त बनाता है।

Question 2

px और % यूनिट में क्या अंतर है?

Accepted Answer

पिक्सेल वैल्यू (px) निश्चित आकार के गोल कोने बनाते हैं जो एलिमेंट के साथ स्केल नहीं होते। प्रतिशत वैल्यू (%) एलिमेंट के आयामों के सापेक्ष होते हैं - 50% हमेशा अधिकतम संभव गोलाई बनाता है। सुसंगत कोनों के लिए px, रिस्पॉन्सिव डिज़ाइन के लिए % का उपयोग करें।

Question 3

क्या मैं प्रत्येक कोने के लिए अलग रेडियस का उपयोग कर सकता हूं?

Accepted Answer

हां, border-radius 1-4 वैल्यू स्वीकार करता है: 1 वैल्यू सभी कोनों पर लागू होता है, 2 वैल्यू ऊपर-बाएं/नीचे-दाएं और ऊपर-दाएं/नीचे-बाएं सेट करते हैं, 4 वैल्यू प्रत्येक कोने को अलग-अलग सेट करते हैं (ऊपर-बाएं, ऊपर-दाएं, नीचे-दाएं, नीचे-बाएं)।

Question 4

असममित ब्लॉब आकार कैसे बनाएं?

Accepted Answer

पूर्ण नियंत्रण के लिए 8 वैल्यू का उपयोग करें: border-radius: 10px 20px 30px 40px / 40px 30px 20px 10px। '/' से पहले की वैल्यू क्षैतिज रेडियस को नियंत्रित करती हैं, '/' के बाद की वैल्यू प्रत्येक कोने के लिए लंबवत रेडियस को नियंत्रित करती हैं।

Question 5

क्या border-radius एलिमेंट की सामग्री को प्रभावित करता है?

Accepted Answer

border-radius केवल विज़ुअल बॉर्डर को गोल करता है। सामग्री तब तक कोनों में ओवरफ्लो हो सकती है जब तक आप 'overflow: hidden' भी सेट नहीं करते। यह सामग्री को गोल आकार से मिलान करने के लिए क्लिप करता है, गोल कंटेनरों के अंदर इमेज के लिए उपयोगी है।

बॉर्डर रेडियस जेनरेटर

नियंत्रण

विज़ुअल एडिटर