Як змінити колір маркерів у списку, не чіпаючи текст?

Так-так, можна зробити таку «фішку» в HTML і CSS — коли маркери списку мають один колір, а текст біля них — зовсім інший. Це зручно, коли хочеться трішки оживити дизайн сторінки або виділити саме маркери.

Ось простий приклад коду, який допоможе:

html
<ul> <li><span>Скрипка</span></li> <li><span>Гітара</span></li> <li><span>Волинка</span></li> <li><span>Шарманка</span></li> <li><span>Челеста</span></li> </ul>

А в CSS ми кажемо так:

css
li { color: red; /* Колір маркерів */ } li span { color: navy; /* Колір тексту */ }

🔸 Маркери будуть червоні, а
🔹 Текст залишиться стильним темно-синім (navy).

Цей лайфхак ідеально підійде тим, хто любить наводити красу навіть у дрібницях, а ще — для тих, хто працює над версткою електронних книжок чи блогів 😉

Потрібен сайт, консультація, анімація або графічний дизайн? Лишіть заявку і я з вами зв'яжуся!
Підтримати розвиток ресурсу



Підтримати проєкт через Monobank

Hosting CityHost
Коментарі
    Translate »