Властивість CSS Font використовується для керування виглядом текстів. Використовуючи властивості шрифту CSS, ви можете змінити розмір тексту, колір, стиль тощо. Ви вже вивчили, як зробити текст жирним або підкресленим. Тут ви також дізнаєтесь, як змінити розмір шрифту за допомогою відсотка.
Ось деякі важливі атрибути шрифту:
1) Колір шрифту CSS
Колір шрифту CSS є окремим атрибутом у CSS, хоча здається, що він є частиною шрифтів CSS. Використовується для зміни кольору тексту.
Існує три різні формати для визначення кольору:
- За назвою кольору
- За шістнадцятковим значенням
- За RGB
У наведеному вище прикладі ми визначили всі ці формати.
"що таке 10 із 100"
body { font-size: 100%; } h1 { color: red; } h2 { color: #9000A1; } p { color:rgb(0, 220, 98); } } <h2>This heading is shown in serif.</h2> <p>This paragraph is written in monospace.</p> Перевірте зараз Вихід:
<h2>This heading is shown in sans-serif.</h2> <h3>This heading is shown in serif.</h3> <p>This paragraph is written in monospace.</p>
3) Розмір шрифту CSS
Властивість розміру шрифту CSS використовується для зміни розміру шрифту.
Ось можливі значення, які можна використовувати для встановлення розміру шрифту:
| Значення розміру шрифту | опис |
|---|---|
| хх-маленький | використовується для відображення надзвичайно малого розміру тексту. |
| x-малий | використовується для відображення надзвичайно маленького розміру тексту. |
| маленький | використовується для відображення маленького розміру тексту. |
| середній | використовується для відображення тексту середнього розміру. |
| великий | використовується для відображення великого розміру тексту. |
| x-великий | використовується для відображення дуже великого розміру тексту. |
| хх-великий | використовується для відображення надзвичайно великого розміру тексту. |
| менше | використовується для відображення порівняно меншого розміру тексту. |
| більший | використовується для відображення порівняно більшого розміру тексту. |
| розмір у пікселях або % | використовується для встановлення значення у відсотках або пікселях. |
Practice CSS font-size property <p> This font size is extremely small.</p> <p> This font size is extra small</p> <p> This font size is small</p> <p> This font size is medium. </p> <p> This font size is large. </p> <p> This font size is extra large. </p> <p> This font size is extremely large. </p> <p> This font size is smaller. </p> <p> This font size is larger. </p> <p> This font size is set on 200%. </p> <p> This font size is 20 pixels. </p>Перевірте зараз
Вихід:
Цей розмір шрифту надзвичайно малий.
Цей розмір шрифту надзвичайно малий
Цей розмір шрифту невеликий
Цей розмір шрифту середній.
Цей розмір шрифту великий.
Цей розмір шрифту дуже великий.
Шрифти для gimp
Цей розмір шрифту надзвичайно великий.
Цей розмір шрифту менший.
Цей розмір шрифту більший.
Цей розмір шрифту встановлено на 200%.
Цей розмір шрифту становить 20 пікселів.
4) Стиль шрифту CSS
Властивість CSS Font style визначає тип шрифту, який ви хочете відображати. Він може бути курсивом, похилим або звичайним.
body { font-size: 100%; } h2 { font-style: italic; } h3 { font-style: oblique; } h4 { font-style: normal; } } <h2>This heading is shown in italic font.</h2> <h3>This heading is shown in oblique font.</h3> <h4>This heading is shown in normal font.</h4> Перевірте зараз Вихід:
<h2>This heading is shown in italic font.</h2> <h3>This heading is shown in oblique font.</h3> <h4>This heading is shown in normal font.</h4>
5) Варіант шрифту CSS
Властивість CSS font variant визначає, як встановити варіант шрифту елемента. Він може бути звичайним і маленьким.
читання файлу csv у java
p { font-variant: small-caps; } h3 { font-variant: normal; } <h3>This heading is shown in normal font.</h3> <p>This paragraph is shown in small font.</p> Перевірте зараз Вихід:
<h3>This heading is shown in normal font.</h3> <p>This paragraph is shown in small font.</p>
6) Товщина шрифту CSS
Властивість товщини шрифту CSS визначає щільність шрифту та вказує, наскільки жирним є шрифт. Можливі значення товщини шрифту можуть бути нормальними, жирними, жирнішими, світлішими або цифрами (100, 200... до 900).
Цей шрифт напівжирний.
Цей шрифт жирніший.
Цей шрифт світліший.
Цей шрифт має вагу 100.
Цей шрифт має вагу 200.
Цей шрифт має вагу 300.
Цей шрифт має вагу 400.
Цей шрифт має вагу 500.
Цей шрифт має вагу 600.
Цей шрифт має вагу 700.
Цей шрифт має вагу 800.
Цей шрифт має вагу 900.
Перевірте заразВихід:
Цей шрифт напівжирний.
java xor
Цей шрифт жирніший.
Цей шрифт світліший.
Цей шрифт має вагу 100.
Цей шрифт має вагу 200.
Цей шрифт має вагу 300.
Цей шрифт має вагу 400.
Цей шрифт має вагу 500.
Цей шрифт має вагу 600.
Цей шрифт має вагу 700.
Цей шрифт має вагу 800.
arraylist у сортуванні java
Цей шрифт має вагу 900.