Здравствуйте! На прошлом уроке мы разбирались как задать стили для абзацев. Сегодня поговорим о стилизации списков.
CSS предоставляет специальные свойства по стилизации списков. Одним из таких свойств является list-style-type. Оно может принимать следующие значения для нумерованных списков:
-
decimal
: десятичные числа, отсчет идет от 1 -
decimal-leading-zero
: десятичные числа, которые предваряются нулем, например, 01, 02, 03, … 98, 99 -
lower-roman
: строчные латинские цифры, например, i, ii, iii, iv, v -
upper-roman
: заглавные латинские цифры, например, I, II, III, IV, V… -
lower-alpha
: строчные латинские буквы, например, a, b, c..., z -
upper-alpha
: заглавные латинские буквы, например, A, B, C, … Z
Для ненумерованных списков:
-
disk
: черный диск -
circle
: пустой кружочек -
square
: черный квадратик
Например:
ul{ list-style-type: square; }
Чтобы вообще отключить маркеры у элементов списка, используется значение none
:
ul{ list-style-type: none; }
Данное свойство может применяться как ко всему списку, так и к отдельным элементам. Например:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Стилизация списков в CSS3</title> <style> .decimal{ list-style-type: decimal; } ol{ list-style-type: lower-roman; } </style> </head> <body> <ol> <li>Элемент 1</li> <li class="decimal">Элемент 2</li> <li>Элемент 3</li> <li>Элемент 4</li> </ol> </body> </html>
Читать далее
![]()
Это интересно
+1
|
|||
Последние откомментированные темы: