HTML/CSS ब्लॉक को अलग-अलग साइज़ पर टेस्ट करें

यह कैसे काम करता है

आप जो HTML और CSS लिखते हैं उसे एक स्वतंत्र मिनी-डॉक्युमेंट में जोड़कर srcdoc एट्रिब्यूट के ज़रिए <iframe> टैग में डाला जाता है। यह iframe "sandbox" मोड में है, यानी पेज के बाकी हिस्से से अलग: वह कोई स्क्रिप्ट नहीं चला सकता (कोई <script> अनुमत नहीं), और न ही साइट के बाकी हिस्से तक पहुँच सकता है, जिससे पेस्ट किए गए कंटेंट से किसी भी दुर्भावनापूर्ण इंजेक्शन का जोखिम नहीं रहता। पहले से तय फ़ॉर्मैट (मोबाइल, टैबलेट, डेस्कटॉप) चुनें या अपनी चौड़ाई और ऊँचाई डालकर अपने ब्लॉक का रेस्पॉन्सिव व्यवहार देखें।

क्या प्रीव्यू में JavaScript चलती है?

नहीं, जानबूझकर: iframe allow-scripts अनुमति के बिना सैंडबॉक्स में है, इसलिए पेस्ट किए गए HTML में मौजूद कोई भी <script> अनदेखा कर दिया जाएगा। केवल HTML का रेंडर और CSS का लागू होना ही प्रीव्यू होता है।

क्या CSS media queries टेस्ट की जा सकती हैं?

हाँ: आपके CSS में शामिल @media नियम प्रीव्यू के लिए तय चौड़ाई (प्रीसेट या कस्टम मान) के अनुसार सामान्य रूप से लागू होते हैं, ठीक वैसे ही जैसे साइज़ बदले गए असली ब्राउज़र में।

आपका HTML और CSS कभी किसी सर्वर को नहीं भेजा जाता: रेंडर पूरी तरह आपके ब्राउज़र में, लोकल रूप से बनता है।