انتقل إلى المحتوى

منسّق HTML

الصق HTML مضغوطًا أو غير مرتب لتحصل على شيفرة نظيفة بإزاحة متسقة يسهل قراءتها ومقارنتها.

تتم المعالجة محليًا في متصفحك

الخيارات
0 حرف · 0 سطر
ستظهر النتيجة هنا.

ما هي أداة منسّق HTML؟

كثيرًا ما يكون HTML الصادر عن أدوات البناء أو محررات أنظمة المحتوى أو "عرض المصدر" سطرًا واحدًا طويلًا أو غير منتظم الإزاحة. يعيد المنسّق ترتيب الشيفرة بمستوى إزاحة واحد لكل مستوى تداخل فتظهر بنية المستند بوضوح.

تستخدم هذه الأداة منسّق HTML في js-beautify. يمكنك اختيار 2 أو 4 أو 8 مسافات أو علامات جدولة، وعرض لالتفاف الأسطر الطويلة، وسمة واحدة في كل سطر، وإزاحة head وbody، والإبقاء على الأسطر الفارغة أو حذفها. وتبقى العناصر المضمّنة مثل <a> و<strong> في سطرها فلا يتغير تدفق النص.

كيف تعمل؟

  1. الصق HTML في خانة الإدخال؛ تظهر النتيجة المنسقة أثناء الكتابة.
  2. اختر الإزاحة (مسافات أو علامات جدولة) وعرض الالتفاف، والقيمة 0 تعطّل الالتفاف.
  3. فعّل سمة واحدة في كل سطر إذا كانت وسومك تحمل سمات كثيرة، وحدّد هل تُبقى الأسطر الفارغة.
  4. انسخ HTML المنسق أو نزّله.

حالات الاستخدام الشائعة

  • قراءة صفحة مضغوطة أو قالب بريد إلكتروني للعثور على وسم إغلاق مفقود.
  • توحيد الإزاحة قبل إضافة HTML إلى نظام التحكم بالإصدارات.
  • جعل ناتج مكوّن ما مناسبًا للمقارنة بين إصدارين.
  • تجهيز مقتطف للتوثيق أو لتقرير عن خطأ.

أمثلة

جرّب هذا المدخل في الأداة أعلاه:

المدخل
<!DOCTYPE html><html><head><meta charset="utf-8"><title>Demo</title></head><body><nav class="menu"><ul><li><a href="/">Home</a></li><li><a href="/about">About</a></li></ul></nav><main><h1>Hello</h1><p>This is a <strong>sample</strong> page with <em>inline</em> text.</p></main></body></html>
المخرج
<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8">
    <title>Demo</title>
  </head>

  <body>
    <nav class="menu">
      <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/about">About</a></li>
      </ul>
    </nav>
    <main>
      <h1>Hello</h1>
      <p>This is a <strong>sample</strong> page with <em>inline</em> text.</p>
    </main>
  </body>

</html>

الخصوصية

تعمل أداة منسّق HTML بالكامل داخل متصفحك. يُعالَج النص أو الملفات التي تقدّمها على جهازك ولا تُرفع ولا تُسجَّل ولا تُخزَّن على خوادمنا.

القيود

لا يتحقق المنسّق من صحة HTML ولا يصلح أخطاء مثل الوسوم غير المغلقة، وقد تكون المسافات مؤثرة داخل <pre> أو في النص المضمّن، لذا راجع النتيجة قبل النشر.

الأسئلة الشائعة

هل يغيّر التنسيق طريقة عرض الصفحة؟

يغيّر المسافات بين الوسوم فقط. تبقى العناصر المضمّنة في سطرها ويُحفظ محتوى <pre>، لكن إضافة فواصل الأسطر قد تغيّر تباعد النص في تصاميم غير معتادة.

ماذا يفعل خيار الالتفاف؟

تُقطع الأسطر الأطول من العرض عند المسافات. وبالقيمة 0 يحتفظ كل سطر بطوله في المصدر، وهو مفيد لقيم السمات الطويلة.

هل يُرسل HTML الخاص بي إلى خادم؟

لا. يُحمَّل المنسّق في متصفحك ويعمل محليًا، فلا تُرفع شيفرتك أبدًا.

المزيد من الأدوات في أدوات المطورين →