Тег розміру шрифту в html

17

Від автора: при створенні веб-сторінок розробники зобов’язані вказувати якісь розміри. Які можливості в цьому плані дають нам HTML і CSS?

Шрифт на сторінці

Тег розміру шрифту в html – це хіба що sub, sup й strong, які так чи інакше змінюють розмір букв. Але html в цьому плані дає дуже малі можливості. Був, звичайно, тег font, але сьогодні він давно вже застарів. Якщо вам дійсно цікаво, як більш гнучко змінювати розмір шрифту, то потрібно звернутися до можливостей CSS.

CSS властивість font-size

В CSS можна задати будь-яку величину тексту і це можна зробити не тільки в пікселях, але і в інших одиницях виміру. Найчастіше її ставлять все-таки в пікселях, але можна і по-іншому. Наприклад, у відсотках. За 100% береться шрифт батьківського елемента.

Наприклад, якщо ми задаємо величину тексту у відсотках якомусь абзацу і він лежить в тегу body, то для нього 100% буде дорівнює розміру, заданого для body. Відповідно, якщо у тега заданий шрифт 12 пікселів, то щоб задати абзацом розмір 24 пікселя, потрібно написати так:

p{font-size: 200%}

Тег розміру шрифту в html

Це якщо використовувати відсотки. Ще одна популярна відносна величина – em або висота шрифту батьківського елемента. Прописування відносних величин краще тим, що при зміні розміру тексту все зміниться пропорційно і буде добре відображатися.

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

selector{font-size: larger}

Текст в елементі з потрібним селектором стане більше, ніж у батьків. Html теги розміру існують, але використовувати їх все ж таки не рекомендується. Це теги big small. Висновок тексту дозволяє трохи збільшити або зменшити розмір букв порівняно з батьківським елементом. Але сьогодні краще використовувати css, якщо вам треба задати величину.

Тег розміру шрифту в html

Розмір основних елементів на веб-сторінці

Щодо завдання розмірів для інших елементів також: потрібно використовувати для цієї мети css, а не html. Взагалі в тегу можна задати такі атрибути, як width і height, але робити це незручно. А найголовніше – це не відповідає стандартам, які визначають, що зовнішній вигляд і структуру потрібно відокремлювати одне від одного, виносячи в окремі файли.

З цієї причини для визначення ширини та висоти елемента прийнято використовувати css-властивості width і height.

Тег розміру шрифту в html
img{
width: 50px;
height: 50px
}

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

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

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