Веб-розробка стала невід'ємною частиною сучасного світу і встановлення різних стилів на веб-сторінки є основою для створення естетично привабливого та функціонального дизайну. Одним із найбільш поширених та важливих стилів є зміна товщини тексту за допомогою CSS.
Зміна товщини тексту дозволяє виділити певні елементи, додати візуальний інтерес та покращити читабельність. Для зміни товщини тексту CSS використовується властивість "font-weight". За допомогою цієї властивості можна встановити різні значення, щоб отримати бажаний ефект.
У CSS існує кілька ключових слів, які можна використовувати для керування товщиною тексту. Однак, крім ключових слів, можна також вказати числове значення. Значення "normal" використовується для завдання звичайної товщини тексту, а "bold" – для жирного тексту. Крім того, є інші значення, такі як "lighter" і "bolder", які дозволяють керувати товщиною тексту щодо поточного значення.
У цій статті ми розглянемо різні способи зміни товщини тексту за допомогою CSS та наведемо приклади коду для кожного методу. Отримайте необхідні навички, щоб створювати стильні та професійно виглядають веб-сторінки!
| Теги | Опис |
|---|---|
<h1> | Визначає заголовок першого рівня. Заголовок за замовчуванням має жирне зображення. |
<h2> | Визначає заголовок другого рівня. Заголовок за замовчуванням має жирне зображення. |
<h3> | Визначає заголовок третього рівня. Заголовок за замовчуванням має жирне зображення. |
<p> | Визначає пункт тексту. За промовчанням текст параграфа має нормальне зображення. |
<b> | Визначає напівжирне зображення тексту. |
<strong> | Визначає виділення тексту сильнішим чином. Текст за замовчуванням має жирне зображення. |
<i> | Визначає курсивне зображення тексту. |
<em> | Визначає виділення тексту за допомогою курсиву. Текст за замовчуванням має курсивне зображення. |
Як змінити товщину тексту CSS?
Для того, щоб шрифт став жирним, у CSS є властивість font-weight. Значення, які приймає властивість, можуть бути від 100 до 900 з кроком 100 або текстові – bold|bolder|lighter|normal. Надсвітле зображення, яке може відобразити браузер, має значення 100, а наджирне – 900.
Як змінити ширину тексту CSS?
Розміром шрифту можна керувати за допомогою властивості font-size . Тут визначення розміру використовується одиниця rem. Якщо значення rem для <html> не задано, воно приймається за 1rem, і всі інші розміри задаються щодо нього. Таким чином, наприклад, 1.2rem збільшить розмір шрифту на 20%.
Як зробити текст напівжирним у CSS?
Визначте, яку ділянку тексту необхідно виділити та використовуйте CSS-властивість font-weight, яка відповідає за товщину шрифту. Часті значення: 400 або normal – звичайний шрифт, значення за замовчуванням; 700 або bold – напівжирний шрифт.