Підручник HTML - Цитати та обрив рядка

У цьому уроці ми з вами поговоримо про виділення цитат у тексті та про примусове урвище рядка. В принципі, розглянуті тут теги не так часто використовуються в HTML-сторінках, але іноді без них не обійтися. Тож поїхали.

Тег або виділяємо довгі цитати

Тег. використовується HTML для виділення так званих «довгих цитат», наприклад одного або декількох параграфів. Цей тег є блоковимі може містити блокові теги, але не може містити вбудовані . Крім цього він додає такі ж як у параграфів зовнішні поля зверху та знизу, але ще додає і бічні поля, завдяки чому відбувається візуальне виділення тексту, що цитується.

Приклад використання тега BLOCKQUOTE

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

Навіщо потрібен тег BLOCKQUOTE? Ось що нам про це каже сайт Сеодон.ру:

Дуже часто тег BLOCKQUOTE використовують не за прямим призначенням - виділення тексту, що цитується. А лише заради бічних відступів, які він створює. В принципі, подібне застосування цього тега не суперечить синтаксису HTML, головне, щоб BLOCKQUOTE містив блокові теги. Але все ж таки краще подібним чином його не використовувати, так як BLOCKQUOTE призначений саме для виділення довгих цитат.

Тег чи виділяємо невеликі цитати

А ось тег. використовується для позначення невеликих цитат або слів у переносному значенні. Весь текст, який знаходиться між тегами цього елемента, він ставить у лапки . До речі, - це найпростішийвбудований (рівня рядка) тег, який може містити лише вбудовані теги.

Приклад виділення цитат

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

Для вивчення мови набагато важливіше вільна допитливість, ніж грізна необхідність. Августин Аврелій.

Чому б ти не вчився,ти вчишся для себе. Петроній.

Тег або примусовий обрив рядка

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

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

Приклад використання тега BR

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

Мета творчості - самовіддача, А не галас, не успіх. Пастернак.

Ви цілком можете запитати: «А навіщо мені використовувати тег , якщо я можу просто написати текст у кількох параграфах, він тоді теж буде вказаний на різних рядках?» Все це так, але не забувайте, що тег

створює зверху і знизу поля порожнього простору, а тег цього не робить. Крім цього параграфи те й існують, щоб у кожному їх містилися осмислені і закінчені висловлювання, а чи не шматки тексту.

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

. ), можна зробити вертикальні відступи будь-яких розмірів. Але, хоча це й не суперечить синтаксису HTML, я не рекомендую вам так чинити, оскільки цей тег для цього не призначений.

  1. Зробіть так, щобфон сторінки був чорний, а текст — білий.
  2. Створіть заголовок статті та двох її розділів. Вкажіть для них шрифт Verdana і нехай другий підзаголовок розташований по центру сторінки.
  3. Напишіть під першим і другим заголовком за параграфом, а під третім — цитату, що складається з двох параграфів.
  4. Виділіть у першому параграфі дві цитати і нехай одна буде написана жирним шрифтом, а друга курсивом.
  5. Зробіть в останньому параграфі п'ять обривів рядка і нехай текст у ньому розташовується по центру сторінки.