CSS function symbols()
Опис
Функція symbols() в CSS надає можливість створювати власні символи для використання у маркерах списку. Ця функція зазвичай використовується разом зі властивістю list-style-type, де ви можете вказати значення symbols(), щоб використовувати власні символи замість типових маркерів списку.
Наприклад, ви можете використовувати функцію symbols() разом із значенням list-style-type: symbols(...) для створення списку з власними символами, такими як римські цифри, геометричні фігури або іконки.
При використанні функції symbols(), важливо правильно визначити набір символів у потрібному порядку та вказати їхні імена у функції. Це дозволить контролювати порядок використання символів для різних рівнів списку.
Приклад використання:
ul {
list-style-type: symbols("▶", "▷", "▸");
}
У даному прикладі символи "▶", "▷" та "▸" використовуються як маркери списку для елементів <ul>. Такий підхід дозволяє створювати стилізовані та власні символи маркерів списку, що підвищує гнучкість та можливості в оформленні ваших веб-елементів.
| Порада: | Перед використанням функції |
| Порада: | Правильно визначайте порядок символів у функції |
| Порада: | Експериментуйте з різними символами та їх поєднаннями для створення унікальних та цікавих маркерів списку. |
Синтаксис
symbols(name1 [, name2 [, ...]]);<name>Імена символів можуть бути рядками або ключовими словами, що відповідають певним символам. Варіанти значень можуть включати ключові слова, такі як
disc,circle,squareдля використання типових маркерів списку, або власні символи.
Переглядачі
| Переглядач | ||||
|---|---|---|---|---|
91 |
35 |
77 |
91 |
| Переглядач | |||
|---|---|---|---|
91 |
91 |
35 |
Мобільних переглядачів ще не додано.
Приклади
При наведенні курсору на елемент списку, маркери змінюються на символи "▷".
Визначення символу для списку за допомогою функції symbols().