मैंने व्यूपोर्ट को 480px चौड़े में आकार बदलने के लिए क्रोम DevTools का उपयोग किया है, जैसा कि नीचे दिखाया गया है।क्रोम DevTools उत्तरदायी व्यूपोर्ट क्यों लगता है कि यह 980px चौड़ा है?
मैं बूटस्ट्रैप के ग्रिड लेआउट का उपयोग कर रहा हूं, इसलिए मेरे पास div.container
है जिसका उपयोग मैं नीचे बाईं ओर दिखाया गया है। जब मैं इस पर होवर करता हूं, तो मुझे लगता है कि क्रोम में div
चौड़ाई 750px
(और पूरे body
980px
है) के रूप में चिह्नित है, भले ही मेरे पास स्पष्ट रूप से एक छोटे रिज़ॉल्यूशन पर स्क्रीन सेट हो। यहां तक कि शीर्ष पर शासक भी दिखाता है कि यह 480px चौड़ा है।
आगे की पुष्टि के लिए, आप मीडिया क्वेरी देख सकते हैं जो कहता है कि 750 पीएक्स की चौड़ाई केवल उच्च संकल्प (न्यूनतम 768 पीएक्स) पर सेट की जानी चाहिए, इसलिए व्यूपोर्ट यह मान रहा है कि यह इसकी तुलना में अधिक चौड़ाई है।
क्या मैं गलत समझता हूं कि उत्तरदायी सुविधा का उपयोग कैसे किया जाता है?
धन्यवाद!
क्या मूल्य आप व्यूपोर्ट के मेटाडाटा में है में शामिल किया जाना चाहिए? – Justinas
क्या यह 'मेटा नाम =" व्यूपोर्ट "..> टैग है? मैंने '
' की जांच की और उस नाम से कुछ भी नहीं देखा, इसलिए मुझे लगता है कि यह एक डिफ़ॉल्ट मान का उपयोग करता है? – user2490003आह, मुझे यह पृष्ठ मिला जो बताता है कि 'मेटा' टैग क्या है। जब मैंने इसे जोड़ा, तो समस्या ठीक हो गई। सुझाव के लिए धन्यवाद! https://developers.google.com/web/fundamentals/design-and-ui/responsive/fundamentals/set-the-viewport?hl=hi – user2490003