यह ब्लॉग चर्चा करेगा:
रूपरेखा त्रिज्या क्या है?
' खाका 'संपत्ति का उपयोग तत्व की रूपरेखा को आकार देने के लिए किया जाता है, लेकिन इसे सीधे लागू नहीं किया जा सकता है। इसलिए, एक रूपरेखा पर त्रिज्या प्रभाव को लागू करने की वैकल्पिक विधि 'का उपयोग कर रही है' बॉर्डर-त्रिज्या 'सीएसएस संपत्ति। यह रूपरेखा के लिए गोलाकार कोनों को निर्दिष्ट करता है।
HTML एलीमेंट पर आउटलाइन रेडियस इफ़ेक्ट कैसे लागू करें?
बाह्यरेखा त्रिज्या गुण का उपयोग करने के लिए, दिए गए निर्देशों को पढ़ें।
चरण 1: शीर्ष एम्बेड करें
प्रारंभ में, 'से किसी भी शीर्षक टैग का उपयोग करके शीर्षकों को एम्बेड करें' <एच1> ' को ' <एच6> ”। उदाहरण के लिए, हमने 'का उपयोग किया है। <एच1> ' और ' <एच2> ”एक HTML दस्तावेज़ पर दो अलग-अलग शीर्षकों को एम्बेड करने के लिए टैग।
चरण 2: पहला डिव कंटेनर जोड़ें
उसके बाद, 'का उपयोग करके एक कंटेनर जोड़ें' <दिव> ' टैग। इसके अलावा, 'डालें कक्षा ” विशेषता और अपनी पसंद के अनुसार वर्ग के लिए नाम निर्दिष्ट करें।
चरण 3: दूसरा div कंटेनर बनाएँ
दूसरा बनाओ ' डिव ” उसी प्रक्रिया का पालन करके कंटेनर:
< एच 1 शैली = 'रंग: आरजीबी (48, 10, 218)' > Linuxhint लिमिटेड यूके < / एच 1 >< एच 2 >
आउटलाइन सर्कुलर के कोने बनाने के लिए बॉर्डर-रेडियस के विभिन्न उदाहरण।
< / एच 2 >
< डिव कक्षा = 'बॉक्स1-डिव' >
Linuxhint अपने उपयोगकर्ताओं के लिए सर्वोत्तम और सबसे अनूठी सामग्री प्रदान करता है।
< / डिव >
< डिव कक्षा = 'बॉक्स2-डिव' >
यह कई कैटेगरी पर काम करता है।
< / डिव >
उपरोक्त कोड का आउटपुट नीचे दिखाया गया है:
चरण 4: पहले कंटेनर की रूपरेखा निर्धारित करें
'का उपयोग करके पहले कंटेनर तक पहुँचें .box1-div 'कक्षा जहां' . ” कक्षा तक पहुँचने के लिए एक चयनकर्ता है:
.box1-div {खाका : ठोस ;
चौड़ाई : 300 पीएक्स ;
गद्दी : 15 पीएक्स ;
अंतर : 25 पीएक्स ;
}
फिर, नीचे सूचीबद्ध सीएसएस गुणों को लागू करें:
- ' खाका ” संपत्ति का उपयोग तत्व के चारों ओर एक रूपरेखा जोड़ने के लिए किया जाता है। उदाहरण के लिए, इसका मान 'के रूप में सेट किया गया है' ठोस ”।
- ' चौड़ाई ' तत्व के आकार को क्षैतिज रूप से निर्दिष्ट करता है।
- ' गद्दी ” का उपयोग तत्व की सामग्री के आसपास के स्थान को आवंटित करने के लिए किया जाता है।
- ' अंतर ” एलिमेंट बॉर्डर के बाहरी हिस्से में स्पेस निर्दिष्ट करें।
चरण 5: दूसरे कंटेनर की रूपरेखा निर्धारित करें
अब, दूसरे तत्व को उसके संबंधित वर्ग की मदद से एक्सेस करें ” .box2-div ':
.box2-div {खाका : ठोस ;
बॉर्डर-त्रिज्या : 20 पीएक्स ;
चौड़ाई : 300 पीएक्स ;
गद्दी : 15 पीएक्स ;
अंतर : 25 पीएक्स ;
}
सीएसएस संपत्ति लागू करें ' बॉर्डर-त्रिज्या ”तत्व की त्रिज्या को परिभाषित करने के लिए। यह संपत्ति आपको तत्व के चारों ओर गोलाकार कोनों को जोड़ने की अनुमति देती है:
यह देखा जा सकता है कि हमने HTML तत्व पर रूपरेखा त्रिज्या प्रभाव को सफलतापूर्वक जोड़ा है।
निष्कर्ष
' रूपरेखा-त्रिज्या ' अब उपलब्ध नहीं है। उपयोगकर्ता सीएसएस 'बाह्यरेखा' और 'सीमा-त्रिज्या' गुणों की सहायता से रूपरेखा त्रिज्या गुणों को लागू कर सकते हैं। ' खाका 'तत्व के चारों ओर एक रूपरेखा जोड़ता है, और' बॉर्डर-त्रिज्या ” विशेष रूप से रूपरेखा को स्टाइल करने के लिए उपयोग किया जाता है। इस पोस्ट में HTML में एलिमेंट के चारों ओर आउटलाइन रेडियस इफेक्ट जोड़ने के निर्देश प्रदर्शित किए गए हैं।