/ / फाउंडेशन 4 मीडिया क्वेरी - ज़र्ब-फाउंडेशन

फाउंडेशन 4 मीडिया क्वेरी - ज़र्ब-फाउंडेशन

मैं सीएसएस डिजाइनिंग में शुरुआती हूँ।

मैं अपने कॉलेज प्रोजेक्ट के फ्रंट एंड डिज़ाइन के लिए फाउंडेशन 4 (ज़र्ब) का उपयोग कर रहा हूं। मैंने सीखा कि फाउंडेशन 4 उत्तरदायी डिजाइन तैयार करने के लिए प्रकृति में उत्तरदायी है।

फाउंडेशन 4 के साथ सीएसएस मीडिया क्वेरी की कोई ज़रूरत है? यदि हां तो मैं इसका उपयोग कैसे कर सकता हूं इससे मुझे क्या लाभ मिल सकता है?

उत्तर:

उत्तर № 1 के लिए 1

आपको दस्तावेज़ों के "मीडिया-क्वेरीज़" और "ग्रिड" अनुभागों को पढ़ना चाहिए: http://foundation.zurb.com/docs/

<div class="row">
<div id="block" class="small-2 large-8 columns">Content</div>
</div>

यह कोड "कॉलम" को 2 कॉलम चौड़ा बना देगा"छोटे -2" वर्ग के कारण प्रत्येक स्क्रीन आकार के लिए। "बड़ी -8" कक्षा 768px और ऊपर की खिड़की चौड़ाई पर उस व्यवहार को ओवरराइड करती है, जिससे यह बड़ी स्क्रीन पर 8 कॉलम चौड़ी हो जाती है।

सरल बनाने के लिए, वह कोड मोबाइल फोन स्क्रीन पर 2 कॉलम चौड़े और डेस्कटॉप स्क्रीन पर 8 कॉलम होने के लिए "#block" प्रस्तुत करेगा।

यदि आपको IE6-8 समर्थन की आवश्यकता है, तो आपको Respond.js का भी उपयोग करने की आवश्यकता है: https://github.com/scottjehl/Respond