Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Создание различной маркировки для списков

10 мая 2018 | Опубликовано в css | Нет комментариев »

Самое простое, что можно сделать со списками HTML, — изменить значение свойства list-style-type (типа стиля списка). Обратите внимание, свойство list-style (стиля списка) — это другое свойство, важно их не путать. В спецификациях CSS1 и CSS2 выбор значений типа стиля списка довольно ограничен. В спецификации CSS3 вариантов значений гораздо больше, но не все они поддерживаются даже в самых современных версиях браузеров. 

 

 


Для ненумерованных списков значения свойства типа стиля списка могут быть: none (нет), inherit (наследовать), circle (пустой круг), disc (заполненный круг), или square (квадрат). По умолчанию для ненумерованного списка применяется заполненный круг, вложенным ненумерованным спискам первого уровня задается пустой круг, второго уровня — квадрат, для следующих вложенных уровней они чередуются в этой последовательности. Значение «наследовать» просто означает, что список применит значение свойства типа стиля своего родителя. Обратите внимание, что задание значения «нет» свойству типа стиля не уберет отступ списка в большинстве браузеров, это можно сделать с помощью свойства левого внешнего отступа.

Для нумерованных списков выбор значений намного разнообразней. Кроме вышеупомянутых  значений «нет» и «наследовать» также можно использовать следующие значения:

Очень важно обратить внимание на то, что при использовании любых из этих значений разметка нумерованного списка не изменяется: Вы создаете код HTML для списка как обычно, а после этого задаете любые изменения тому, как отображается список, с помощью кода CSS.

Автор урока Dudley Storey

Перевод — Дежурка

Смотрите также:

 

 

 

 

 




Коментарии запрещены.

[an error occurred while processing the directive]


[an error occurred while processing the directive]