Новини високих технологій
» » Розмір тексту в HTML: правила форматування

Розмір тексту в HTML: правила форматування

4-11-2018, 15:00
812
HTML — це мова гіпертекстової розмітки, за допомогою якого здійснюється форматування веб-документів. Він надає основні можливості упорядкування структури документа, а також базові варіанти оформлення сторінки. У цій статті докладно розповімо, як змінити розмір тексту в HTML. Дізнаємося, в яких випадках можна задіяти тільки HTML, а коли краще вдатися до стильовим таблиць CSS.

Зміна розміру за допомогою тега

Існує кілька різних способів, за допомогою яких можна виконати зміна розміру тексту в HTML. Такі можливості є як сама мова веб-розмітки, так і підключаються до документа таблиці стилів CSS. Перший спосіб збільшити або зменшити текст на веб-сторінці — це використання тега . Синтаксис при використанні цього тега буде наступним:

Текст для прикладу

Давайте розглянемо цей приклад докладніше. Як бачите, тут зазначено три атрибути тега , які дозволяють задавати гарнітуру, розмір і колір тексту HTML.

<script async="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
<!-- fb_336x280_mid -->

<script> (adsbygoogle = window.adsbygoogle ||[]).push({});

За розмір відповідає атрибут size — він дозволяє задавати розмір тексту в умовних одиницях. Середнє значення даного параметра приймається 3. Відповідно, ставити його можна як в абсолютних одиницях (тобто 174 і т. д.), так і у відносних - з допомогою знаків плюса або мінуса (+3 -2). У другому випадку розмір тексту буде змінений по відношенню до базового.

Атрибут color показує, якого кольору буде текст, а face відповідає за гарнітура (шрифт). Таким чином, текст на прикладі стандартного середнього розміру, зеленого кольору, написаний шрифтом Georgia.

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

<script async="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
<!-- fb_336x280_mid2 -->

<script> (adsbygoogle = window.adsbygoogle ||[]).push({});

Інші способи зменшення і збільшення тексту в HTML

Для того щоб змінити розмір тексту у HTML використовуються теги і .

Вживаються ці теги наступним чином:

   

Цікаво, що для того, щоб зробити текст ще більше або менше, тег можна повторити кілька разів.

    

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

Зміна розміру тексту за допомогою CSS

Для того щоб змінити розмір тексту, рекомендується використовувати засоби CSS. Синтаксис буде виглядати наступним чином:

p {
font-size: 11pt;
}


Для цього способу доступно набагато більшу кількість можливостей. Можна змінювати розмір тексту в різних одиницях, таких як пункти (pt), пікселі (px), відсотки та інші. Даний метод використовується або за допомогою тега безпосередньо в тілі HTML-документа, або за допомогою зовнішньої таблиці стилів, підключеної окремим файлом з посиланням в документі. Розробники одностайні в думці, що з урахуванням оптимізації і кросбраузерності в наш час краще використовувати для стилізації та дизайну саме можливості CSS, а для HTML залишити його початкову функцію мови розмітки гіпертексту. Отже, ми познайомилися з кількома різними способами зміни розміру тексту в HTML-документах. Який з них використовувати — залежить від ваших потреб і бажаного функціоналу сторінки.
Цікаво по темі
Як змінити розмір шрифту в HTML
Як змінити розмір шрифту в HTML
Якісна верстка веб-сайтів має головну мету — зробити інформацію на сторінці максимально читабельною і зручною для сприйняття користувачем. І робота з
Курсив на CSS: зміна накреслення шрифту
Курсив на CSS: зміна накреслення шрифту
Курсив - один з найпопулярніших способів виділити фрагмент тексту і надати йому певну значимість. Він ідеально підходить для цитат, посилань, назв і
Основні HTML meta-теги: опис
Основні HTML meta-теги: опис
Теги в HTML розташовуються усередині тега і дуже важливі для ранжирування веб-сторінки в пошукових системах.
Створення таблиці в HTML
Створення таблиці в HTML
У таблицях зручно розташовувати дані, об'єднані між собою певними залежностями. Для створення таблиць у HTML використовуються спеціальні HTML-теги. З
CSS: підключення до веб-документа
CSS: підключення до веб-документа
Вивчення CSS - це наступний після HTML і обов'язковий етап освоєння веб-програмування. Дана технологія значно розширює можливості розмітки сторінок
Як змінити колір тексту на HTML-сторінці?
Як змінити колір тексту на HTML-сторінці?
При створенні веб-сторінки доводиться стикатися з різними проблемами дизайну. Одним з найпоширеніших ...