Існує різниця між тим, що написано в вашому коді HTML і що відображається в браузері.
Як ми вже бачили, теги HTML, такі як <р>. тільки Новомосковскются браузером (щоб знати, який тип вмісту написаний), але не відображаються в ньому.
Іншим видом написаного коду, який ігнорується браузером, є прогалина. він включає в себе:
- переноси рядків;
- порожні рядки;
- табуляція (або відступи).
перенесення рядків
Перенесення рядків і порожні рядки (які являють собою послідовність переносів рядків) в коді HTML ігноруються браузером. Вони складають лише єдиний простір.
Щоб реально вставити перенесення рядка вам потрібно використовувати елемент
:
Табуляція - це спеціальний символ, отриманий за допомогою клавіші Tab. Вона зазвичай переміщує курсор на наступну позицію табуляції, але іноді перетворюється в два пробілу.
У всякому разі, як і звичайний пробіл, табуляція невидима. Вона також ігнорується браузером:
Якщо ви хочете додати простір перед словом, вам доведеться використовувати CSS.
Якщо ви хочете закрити елемент HTML, то повинні спершу закрити всі його дочірні елементи.
Форматування в вигляді дерева
Оскільки елементи HTML можуть бути вкладені одна в одну, ви повинні стежити за порядком. в якому вони були відкриті, так як це буде впливати на порядок, в якому вони закриті.
Через те, що може бути складно стежити за порядком, в якому були відкриті елементи HTML, рекомендується писати HTML у вигляді дерева:
Форматування в вигляді дерева дозволяє візуально відтворити рівень вкладеності вашого коду HTML. Це дозволяє легко побачити, що:
Табуляція, порожні рядки, набір прогалин і переноси рядків опускаються комп'ютером і всі вони перетворюються в один пробіл.
Немає конкретних правил, що стосуються форматування HTML, але є неявні угоди. зокрема:
- використовуйте табуляцію. щоб допомогти візуалізувати вкладення елементів HTML;
- вставляйте відкривають та закривають теги блокових елементів на окремі рядки;
- пишіть рядкові елементи в один рядок (включаючи відкривають та закривають теги).