Підручник html - параграфи і заголовки

тег

або розбиваємо сторінку на параграфи (абзаци)

Якщо пам'ятаєте, то з тегом

ви вже зустрічалися в цьому підручнику, ну що ж, тепер прийшла пора вивчить його повністю. Отже, тег

відповідає за створення параграфів на HTML-сторінці, і він є блоковим елементом. Сподіваюся, що ви вже запам'ятали, що таке теги рівня блоку. Так, але крім того, що він створює перед собою і після себе переноси рядків в початок - ще він встановлює зверху і знизу себе невеликі поля (зовнішні відступи) порожнього простору, завдяки чому і відбувається візуальне розділення тексту на абзаци. Висота цих полів дорівнює одній порожній рядку.

Тепер найголовніше - тег

може містити лише елементи рівня рядка (вбудовані) і ніякі більше. Тому, наприклад, він не може містити інший параграф, так як сам

є блоковим елементом. Ну, ми до цього ще не раз повернемося. До речі, будь-який текст без тегів теж вважається вбудованим елементом.

Приклад параграфів в HTML

Результат в браузері

Взагалі, що закриває тег

ставити не обов'язково - як тільки браузер зустріне наступний параграф, він автоматично закриє попередній. Але, як я вже говорив, краще закривати всі необов'язкові теги.

У тега

є один необов'язковий атрибут align. який встановлює положення тексту всередині блоку. тобто можна зробити так, щоб кожен рядок параграфа розташовувалася по центру сторінки або притискалася до правого боку, а не до лівої, як зазвичай. Тільки от невдача - атрибута align немає в суворої версії HTML і, можливо, в недалекому майбутньому його перестануть підтримувати сучасні браузери. І що ж робити? А зробимо ми наступне: в одному з найближчих уроків я вам покажу універсальний спосіб, за допомогою якого можна змінювати положення вмісту не тільки всередині параграфів, а й всередині будь-яких блокових елементів HTML-сторінки (заголовків, таблиць, списків і т.д.). Але головне його точно розуміють і будуть розуміти всі браузери.

Теги

-

або заголовки HTML-сторінки

Заголовки грають дуже важливу роль в HTML, використовуючи їх можна розділити текст сторінки на логічні частини, підкреслюючи ступінь важливості кожної, що дозволяє відвідувачам швидше знаходити потрібну інформацію. До того ж пошуковики (Яндекс, Google і т.п.) надають більший «вагу» тексту в заголовках. Існує їх шість типів, де

найважливіший заголовок (першого рівня, верхній), а

найменш значимий (шостого рівня, нижній). наприклад,

може бути заголовком сторінки,

- її розділів,

- підрозділів і т.д.

Теги заголовків є блоковими елементами і, як і параграфи, можуть містити тільки теги рівня рядка і текст. Браузери виділяю текст заголовків напівжирним шрифтом, різним розміром (в залежності від тега) і додають поля порожнього простору зверху і знизу, знову ж таки, як у параграфів.

Синтаксис написання заголовків в HTML

У заголовних тегів є два необов'язкових атрибути - це вже знайомий вам застарілий align і атрибут title. виводить «спливаючу» підказку при наведенні курсору миші на заголовок. Як і у випадку з параграфами, ми не будемо використовувати align. а скоро вивчимо інший спосіб.

Приклад використання заголовків в HTML

Результат в браузері

Тема першого рівня

Тема другого рівня

У цьому завданні вам треба буде створити сторінку імітує невелику статтю, текст пишіть якою завгодно. Можете відразу подивитися результат прикладу, щоб у вас з'явилося уявлення про те, що треба зробити.