MSMuhammad Shahid

כלי חינמי · רץ בדפדפן שלכם

מעצב HTML

הפכו HTML מבולגן או מכווץ לקוד נקי, קריא ועם הזחה אחידה.

גם סקריפטים וסגנונות מוטמעים מקבלים הזחה. ה־HTML רק מעוצב, ולעולם לא מורץ.

תשובה קצרה

הדביקו HTML וקבלו מיד קוד נקי עם הזחה, כולל CSS ו־JavaScript מוטמעים. בחרו 2 רווחים, 4 רווחים או טאב ורוחב שורה אם תרצו. הכלי משנה רק את פריסת הקוד. ה־HTML לעולם לא מורץ ושום דבר לא מועלה, ו־HTML שבור מעוצב כמו שהוא ולא מתוקן.

איך משתמשים

  1. הדביקו HTML. דף מלא או קטע, גם אם הכול בשורה אחת.
  2. בחרו סגנון. הזחה ורוחב גלישה אם תרצו.
  3. העתיקו את התוצאה. היא מתעדכנת תוך כדי הקלדה.

דוגמה

שורת HTML אחת, עם הזחה של 2 רווחים:

קלט

<div><h1>Title</h1><ul><li>One</li><li>Two</li></ul></div>

פלט

<div>
  <h1>Title</h1>
  <ul>
    <li>One</li>
    <li>Two</li>
  </ul>
</div>

שגיאות נפוצות ואיך לתקן אותן

ההזחה נראית שגויה
תג לא סגור או לא תואם משבש את המבנה. מצאו את התג החסר, או הריצו את בודק W3C.
הופיע מרווח קטן בין אלמנטים
רווח בין אלמנטים בתוך שורה יכול להופיע בדף. השתמשו ב־flexbox או השאירו אותם בשורה אחת.

שאלות נפוצות

מהו מעצב HTML?

כלי שמוסיף מעברי שורה והזחה אחידים כדי שהקוד יראה את המבנה שלו. הוא לא משנה את מה שהדף עושה.

האם עיצוב יכול לשנות את מראה הדף?

לעיתים נדירות כן: רווח בין אלמנטים בתוך שורה, כמו span או קישור, יכול להופיע כמרווח קטן. בדקו פריסות שבהן אלמנטים כאלה צמודים.

האם זה מתקן HTML לא תקין?

לא. הכלי מעצב את מה שיש. השתמשו ב־W3C Nu HTML Checker כדי למצוא שגיאות כמו תגים לא סגורים.

2 רווחים או 4?

שניהם בסדר, כל עוד הפרויקט אחיד. 2 רווחים נפוצים ב־HTML, כי הקינון עמוק.

האם זה מעצב CSS ו־JavaScript מוטמעים?

כן. גם התוכן של תגי style ו־script מקבל הזחה.

האם בטוח להדביק HTML עם סקריפטים?

כן. ה־HTML מטופל כטקסט, ולא מורץ או מוצג כדף.

איך פורסים HTML מכווץ מאתר?

העתיקו מ"הצגת מקור" והדביקו כאן. התוצאה קלה לקריאה, אבל ההערות והשמות המקוריים כבר אינם.

האם משהו נמחק?

לא. התגים, המאפיינים והטקסט נשמרים, ורק הרווחים ביניהם משתנים.

איך מקטינים HTML במקום לסדר?

עיצוב מגדיל את הקוד. ל־CSS ולסקריפטים בדף, מכווץ CSS ומכווץ JavaScript מקטינים את הגודל.

איך מציגים קוד מעוצב בדף?

קודדו אותו קודם במקודד HTML, כדי שהדפדפן יציג אותו כטקסט ולא יריץ אותו.

מקורות

קשור

עוד כלים בקבוצה הזו

מדריכים ואפליקציות