HTML फॉर्मेटर
HTML कोड ऑनलाइन फॉर्मेट और इंडेंट करें।
कंटेंट मैनेजमेंट सिस्टम, टेम्पलेट इंजन या कोड जनरेटर द्वारा बनाया गया HTML अक्सर minified होता है और एक ही लाइन में होता है — जिसे पढ़ना, debug करना या refactor करना असंभव होता है। यह HTML formatter आपके markup की nesting संरचना दिखाने के लिए उचित indentation जोड़ता है, जिससे बंद न किए गए tags, गहराई से nested elements, या गलत जगह रखे गए attributes को ढूंढना आसान हो जाता है। यह किसी भी ऐसे व्यक्ति के लिए एक ज़रूरी उपकरण है जो बाहरी स्रोतों से HTML के साथ काम करता है या layout समस्याओं को debug करता है।
📋 इस कैलकुलेटर का उपयोग कैसे करें
अपना HTML input field में paste करें — यह एक snippet हो सकता है या पूरा HTML document। indented output बनाने के लिए "Format HTML" पर क्लिक करें, जिसमें 2-space indentation होगी। Child elements अपने parent के सापेक्ष indent किए जाते हैं। elements के भीतर का text content उस element के स्तर तक indent किया जाता है। Void elements (br, img, input, hr, meta, link) को सही ढंग से संभाला जाता है और उनके लिए closing tags की अपेक्षा नहीं की जाती। formatted output लेने के लिए Copy button का उपयोग करें। formatted HTML input के semantically समान होता है।
💡 मुख्य तथ्य और जानकारी
HTML formatting एक token-आधारित तरीका अपनाता है: input को tag की सीमाओं पर विभाजित किया जाता है, और प्रत्येक token को क्रम में process किया जाता है ताकि वर्तमान indentation depth को track किया जा सके। Opening tags depth बढ़ाते हैं, closing tags इसे घटाते हैं। Void elements (area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr) depth नहीं बढ़ाते। Self-closing tags (जो /> पर समाप्त होते हैं) भी depth नहीं बढ़ाते। Comments को जैसे-का-तैसा संरक्षित रखा जाता है। यह तरीका अधिकांश HTML को सही ढंग से संभालता है लेकिन जानबूझकर किए गए inline formatting को संरक्षित नहीं कर सकता (उदाहरण के लिए, किसी वाक्य के बीच में मौजूद एक <strong> tag को उसकी अपनी अलग लाइन में ले जाया जा सकता है)।