Урок 112 із 239
47%
← Назад

Робота з маркерами списків ul в CSS

Вивчаємо властивість list-style-type для зміни вигляду або приховування маркерів ненумерованих списків.

Робота з маркерами списків ul в CSS

Раніше ми розглядали списки ul і знаємо, що за замовчуванням вони мають маркери у вигляді крапок.

За допомогою CSS можна змінити вигляд цих маркерів або повністю прибрати їх.

Для цього використовується властивість list-style-type.

<ul>
  <li>Перший пункт</li>
  <li>Другий пункт</li>
  <li>Третій пункт</li>
</ul>
ul {
  list-style-type: square;
}
❗ Важливо:

Властивість list-style-type дозволяє керувати тільки виглядом маркера, а не самим текстом списку.

  • disc — круглий маркер (значення за замовчуванням).
  • circle — порожній круг.
  • square — квадрат.
  • none — прибрати маркери списку.
📌 Завдання:
  1. №1. Створіть список ul із декількох пунктів.
  2. №2. Змініть маркери списку за допомогою list-style-type.
  3. №3. Приберіть маркери зі списку.
💡 Показати підказку

Для меню на сайтах часто використовують list-style-type: none, щоб прибрати стандартні маркери.

✅ Показати відповідь
ul {
  list-style-type: none;
}