Как создать простые списки в CSS. Веб-программирование

Создание простых элементов списка css

Не только с помощью HTML можно задать вид списка, но и при помощи атрибута в CSS.

Этот атрибут называется list-style-type. Он может принимать несколько значений.

От значения зависит то, каким образом будет происходить нумерация элементов списка.

Значения атрибута

  • Disc - круги с заливкой.
  • Circle – круги без заливки
  • Square - квадраты с заливкой
  • Decimal – арабские цифры
  • Lower-roman – малые римские цифры
  • Upper-roman – большие римские цифры
  • Lower-alpha – малые латинские буквы
  • Upper-alpha – большие латинские буквы
  • None - без маркера

Вместо маркера списка можно использовать изображение. Для этого есть конструкция list-style-image. В качестве значения данного атрибута следует указать ссылку на картинку, которая будет маркером.

Стоит учитывать, что размеры картинки задать в самом атрибуте нельзя, так что необходимо позаботиться об этом заранее. Пример: ul {list-style-image: url(foto.jpg)}.

Маркер может входить в состав текста списка или может быть отделен от него, как по умолчанию. Для того, чтобы определить поведение маркера, необходимо использовать атрибут list-style-position, который принимает два значения: outside (по умолчанию), inside (внутри текста).

Читайте также:
Преимущества использования каскадных таблиц стилей (CSS) при создании сайта
Языки программирования для создания сайта

Просмотров: 4206

Оцените статью: 1 2 3 4 5





Комментарии

Комментарий добавил(а): А.
Дата: 2012-01-14

Тема интересная, хочется что бы и дальше были такие же статьи по css. И желательно на конкретных примерах.

Написать комментарий




Введите код с картинки