टेलविंड सीएसएस में विकर्ण भिन्नों का उपयोग कैसे करें

यह आलेख बताएगा कि टेलविंड में विकर्ण भिन्नों का उपयोग कैसे करें।

टेलविंड सीएसएस में विकर्ण भिन्नों का उपयोग कैसे करें?

टेलविंड में विकर्ण भिन्न वर्ग एक पूर्वनिर्धारित संख्यात्मक फ़ॉन्ट प्रकार है जो अंश और हर को छोटा बनाता है और उन्हें एक स्लैश द्वारा अलग करता है। इससे भिन्न संख्या शेष पाठ से विशिष्ट प्रतीत होती है।

वाक्य - विन्यास

' का उपयोग करने का सिंटैक्स विकर्ण-अंश 'वर्ग इस प्रकार है:

जैसा कि आप उपरोक्त सिंटैक्स से देख सकते हैं, डेवलपर को 'प्रदान करना होगा' विकर्ण-अंश ' में ' कक्षा 'तत्व की विशेषता.

आइए एक व्यावहारिक उदाहरण के रूप में 'विकर्ण-अंश' वर्ग का उपयोग करें। नीचे दिए गए प्रदर्शन में, उपयोगकर्ता सामान्य भिन्न और विकर्ण भिन्न के बीच अंतर देख सकता है:

उपरोक्त कोड की व्याख्या इस प्रकार है:

• “ डिव 'तत्व' का उपयोग करके पृष्ठभूमि रंग के रूप में बनाया और प्रदान किया जाता है बीजी-{रंग}-{संख्या} ' कक्षा।
• फिर, पाठ को एक बड़ा फ़ॉन्ट आकार प्रदान किया जाता है और 'का उपयोग करके तत्व के केंद्र में संरेखित किया जाता है' टेक्स्ट-एलजी ' और ' पाठ-केंद्र क्रमशः कक्षाएं।
• अगला, दो ' <पी> 'तत्व बनाए जाते हैं, जहां दूसरा' के साथ प्रदान किया जाता है विकर्ण-अंश ' कक्षा।

आउटपुट:

उपरोक्त आउटपुट में विकर्ण अंश और सामान्य अंश के बीच का अंतर स्पष्ट रूप से देखा जा सकता है।

ब्रेकप्वाइंट के साथ विकर्ण भिन्न वर्ग का उपयोग करना

ब्रेकप्वाइंट का उपयोग टेलविंड में मीडिया प्रश्नों के रूप में किया जाता है। निर्दिष्ट न्यूनतम चौड़ाई के साथ पांच डिफ़ॉल्ट ब्रेकप्वाइंट हैं। प्रतिक्रियाशील और गतिशील डिज़ाइन लेआउट बनाने के लिए इन ब्रेकप्वाइंट का उपयोग टेलविंड में किसी भी वर्ग के साथ किया जा सकता है।

'का उपयोग करने के लिए विकर्ण-अंश टेलविंड में ब्रेकप्वाइंट के साथ क्लास, निम्नलिखित सिंटैक्स का उपयोग किया जाता है:

नीचे दी गई तालिका टेलविंड में विभिन्न ब्रेकप्वाइंट के लिए न्यूनतम चौड़ाई प्रदान करती है:

आइए 'के साथ ब्रेकप्वाइंट का उपयोग करें' विकर्ण-अंश उनके उपयोग को व्यावहारिक रूप से समझने के लिए कक्षा:

ऊपर दिए गए कोड में, ' में एक div तत्व प्रदान किया गया है एमडी: विकर्ण-अंश 'वर्ग जो संख्यात्मक अंशों का फ़ॉन्ट बदल देगा जब' एमडी 'ब्रेकपॉइंट पहुंच गया है।

उत्पादन

जैसा कि आप आउटपुट में देख सकते हैं, भिन्नात्मक संख्याएँ विकर्ण भिन्न फ़ॉन्ट के साथ प्रदान की जाती हैं जब ' एमडी ' ब्रेकपॉइंट पहुंच गया है:

टेलविंड अवस्थाओं के साथ विकर्ण भिन्न वर्ग का उपयोग करना

टेलविंड डिफ़ॉल्ट प्रदान करता है' राज्य अमेरिका 'किसी तत्व को डिज़ाइन गुण प्रदान करने के लिए जब वह विशिष्ट स्थिति ट्रिगर होती है। यह डिज़ाइन लेआउट को अधिक आकर्षक और गतिशील बनाता है। टेलविंड में एक स्थिति के साथ 'विकर्ण-अंश' वर्ग का उपयोग करने के लिए, निम्नलिखित सिंटैक्स का उपयोग किया जाता है:

टेलविंड द्वारा प्रदान की गई डिफ़ॉल्ट स्थिति इस प्रकार है:

• होवर: जब उपयोगकर्ता तत्व पर कर्सर घुमाता है।
• केंद्र: जब उपयोगकर्ता किसी तत्व पर नेविगेट करके उस पर ध्यान केंद्रित करता है।
• सक्रिय: जब उपयोगकर्ता किसी तत्व पर क्लिक करके उसे सक्रिय करता है।
• अक्षम करना: जब उपयोगकर्ता को किसी तत्व को सक्रिय करने की अनुमति नहीं है।

नीचे दिया गया प्रदर्शन '' का उपयोग करने का एक व्यावहारिक उदाहरण प्रदान करता है विकर्ण-अंश 'के साथ कक्षा' मंडराना टेलविंड में स्थिति:

“ डिव 'उपरोक्त कोड में तत्व' द्वारा प्रदान किया गया है होवर: विकर्ण-अंश ” वह वर्ग जो भिन्न संख्याओं के सामान्य फ़ॉन्ट को विकर्ण भिन्न फ़ॉन्ट में बदल देगा।

उत्पादन

जैसा कि आप आउटपुट में देख सकते हैं, जैसे ही उपयोगकर्ता उस पर माउस कर्सर घुमाता है, अंश संख्या का संख्यात्मक फ़ॉन्ट बदल जाता है:

यह सब टेलविंड सीएसएस में विकर्ण अंश वर्ग का उपयोग करने के बारे में है।

निष्कर्ष

टेलविंड सीएसएस में विकर्ण भिन्नों का उपयोग करने के लिए, 'का उपयोग करें विकर्ण-अंश ' कक्षा। यह वर्ग अंश और हर को एक स्लैश से अलग करेगा और उन्हें छोटा कर देगा। उपयोगकर्ता डिज़ाइन को अधिक गतिशील बनाने के लिए टेलविंड में डिफ़ॉल्ट ब्रेकप्वाइंट और राज्यों के साथ 'विकर्ण-अंश' वर्ग का भी उपयोग कर सकते हैं। इस आलेख में टेलविंड में विकर्ण भिन्नों का उपयोग करने की प्रक्रिया प्रदान की गई है।