تنسيق HTML
هل حصلت على HTML مصغّر عبر «عرض المصدر» لموقع ما، أو لصقت جزءًا تم إنشاؤه تلقائيًا وكل شيء في سطر واحد غير مقروء؟ الصقه هنا للحصول على نسخة بمسافات بادئة، وسم واحد في كل سطر، قبل دراسته أو تعديله.
تنبيه: هذه أداة تنسيق أساسية (مسافات بادئة حسب مستوى التداخل) وليست محلل HTML كاملاً مثل تلك الموجودة في Prettier. إنها لا تصحح الوسوم المغلقة بشكل خاطئ أو أخطاء بناء الجملة، كما أن محتوى كتل <script> أو <style> لا يُنسق بشكل خاص.
كيف يعمل
الصق HTML المصغّر أو المضغوط في الحقل أعلاه وانقر على «تنسيق»: تكتشف الأداة وسوم الفتح والإغلاق والوسوم ذاتية الإغلاق، وتضع كل وسم في سطر خاص به وتضيف مسافتين بادئتين لكل مستوى تداخل. كما يتم التعرف على الوسوم ذاتية الإغلاق الشائعة (br، img، input، meta، link، hr، إلخ) حتى بدون /> صريح.
لماذا لا يكون HTML المنسق متطابقًا بصريًا بشكل مثالي؟
تضيف إعادة التنسيق أسطرًا جديدة ومسافات بادئة بين الوسوم، مما قد يغيّر المظهر قليلاً إذا كان CSS الخاص بك يعتمد على المسافات البيضاء بين العناصر (نادر، لكنه ممكن مع display: inline). يظل المحتوى وبنية HTML كما هي: فقط عرض الكود المصدري يتغير.
هل يمكن لهذه الأداة تصحيح HTML غير الصالح؟
لا. يفترض المنسق أن وسومك جيدة التكوين بشكل عام (مفتوحة ثم مغلقة بالترتيب الصحيح). إذا واجه وسمًا لم يُغلق أبدًا أو بناء جملة غير معتاد حقًا، فقد تكون النتيجة بمسافات بادئة غير صحيحة. للتحقق من مطابقة HTML، استخدم مدققًا مخصصًا كإجراء إضافي.
يتم تنفيذ التنسيق محليًا 100% في متصفحك عبر WebAssembly: لا يتم إرسال كود HTML الخاص بك أبدًا إلى خادم.