منسّق HTML
ألصق HTML لتجميله بإزاحة متناسقة، أو بدّل إلى وضع التصغير لإزالة المسافات والتعليقات إلى سطر واحد. اختر مسافتين، أو 4 مسافات، أو علامات تبويب. كتل الكود داخل <pre> و<script> و<style> و<textarea> تبقى بلا مساس فلا يتعطّل شيء. قارن حجم المدخل بحجم المخرج لترى ما وفّرت.
تتم معالجة HTML الخاص بك في متصفحك ولا يتم رفعه إلى أي خادم.
كيفية استخدام منسّق html
- اختر تنسيق (تجميل) أو تصغير.
- للتنسيق، اختر حجم الإزاحة: مسافتين، 4 مسافات، أو علامة تبويب.
- ألصق HTML — يظهر الناتج أدناه مع مقارنة للحجم.
- انسخ الناتج، أو نزّله كملف .html.
الأسئلة الشائعة
هل يحافظ على محتوى <pre> و<script> و<style>؟
نعم. يتم التعامل مع المحتوى داخل pre وscript وstyle وtextarea كنص خام ولا تتم إعادة إزاحته أو تقليصه، لذا تبقى كتل الكود سليمة.
ما الذي يزيله التصغير؟
جميع تعليقات HTML والمسافات غير الضرورية بين الوسوم. يتم الاحتفاظ بمسافة واحدة بين النص والوسوم المضمّنة حتى لا تتغير المسافات في العرض الناتج.
هل يُصلح HTML غير الصالح؟
لا. يحترم المنسّق البنية التي تقدّمها. إذا كان HTML غير صالح (وسوم غير مغلقة، إلخ)، فقد يكون الناتج أيضًا غير صالح — أصلح الترميز أولاً.
لماذا يبدو HTML المنسَّق مختلفاً عمّا تنتجه Prettier؟
لكل منسِّق آراؤه: متى يكسر قوائم السمات الطويلة، هل يضع القوس المغلق في سطر مستقل، كيف يتعامل مع العناصر السطرية داخل عناصر كتلية. هذه الأداة تهدف للقراءة المتراصّة؛ Prettier يفضّل الكسر عند 80 عموداً. اختر منسِّقاً واحداً لكل مشروع واضبطه مرّة — الخلط يضمن diffs مزعجة في git.
هل يُعطّل المنسِّق قوالب Vue / Svelte / JSX؟
غالباً نعم. هذا منسِّق HTML، لا منسِّق واعٍ للإطار. وسوم <template> في Vue تبدو كـ HTML، لكن المنسِّق سيُعيد ترتيب سمات الموجِّهات (v-if، :class) بطرق قد يشتكي منها linter لديك. JSX ليس HTML أصلاً — استخدم Prettier أو المنسِّق الرسمي لإطارك لملفّات المكوّنات. هذه الأداة آمنة لملفّات .html العادية وقوالب البريد و HTML المُصدَّر من CMS.