Как стилизировать списки при помощи CSS
09.22.2008 – Рубрика: HTML&CSS
Многие сталкивались с необходимостью стилизировать список с помощью CSS. Например, есть список с нумерацией, и нужно сделать, чтоб нумерация списка была большего размера шрифта, чем само содержимое списка. Или есть список, который отмечается прямоугольником и нужно сделать прямоугольник зеленого цвета, а текст содержимого списка – черного.
Если задать цвет списка, или размер самому элементу li, то оно будет относиться и для содержимого всего элемента. Посему единственный выход, который я нашел, это внутрь списка поместить span, или другой элемент, которому задать стилизрование текста.
Нюанс состоит в том, что при стилизации нумерованного списка содержимое списка должно быть блочным элементом (подробней о том какие элементы блочные можно прочитать в заметке «Строчные – inline и блочные – block-level элементы«), иначе возникнет нежелательный отступ у последней строки текста в списке. Это можно увидеть на примере.
Если кто-то знает другой, более изящный вариант, буду признателен за подсказку!
Tags: CSS
2 Отзывов to “Как стилизировать списки при помощи CSS”
Оставить отзыв
Последние записи
- DATA:URL – Картинки в документе без дополнительных запросов к серверу
(Вторник, 09. 8. 2009 – 20 отзывов) - Как изменить внешний вид checkbox
(Вторник, 04. 28. 2009 – 32 отзывов) - Как сделать галерею товаров для интернет-магазина
(Пятница, 03. 13. 2009 – 8 отзывов) - Я.ру
(Воскресенье, 03. 8. 2009 – 3 отзывов)
Декабрь 11, 2008 в 16:18
я конечно по-меньше знаю, чем на этом сайте написано, но лично у меня все примеры открываются в каких-то ромбиках. Вобщем с серваком меньше всего проблем, если хтмл страница сохранена как:
1. *.html
2. кодировка страницы KOI-8
3. файл сохранён в этой же кодировке KOI-8
сори, если что… просто та же проблема была, сейчас вот так делаю и всё нормально…
Октябрь 27, 2009 в 17:52
Huinya