CSS-стили для списков dl, dt, dd

4426
CSS-стили для списков dl, dt, dd
Содержание:
  1. CSS добавление двоеточия
  2. Список
  3. Список фиксированной шириной
  4. Список с пунктирной линией
  5. Таблица
  6. Полосатая таблица

Альтернативой классических списков ul li и таблиц table являются элементы dl, dt, dd, которые предназначены для создания списка определений.

Поэтому данные элементы часто применяются для создания сайтов и разработки интернет-магазинов.

Рассмотрим определения тегов dl, dt, dd


– общий контейнер (Description List),
– термин (Description Term),
– определение этого термина (Description Definition).

Пример разметки:
Результат:
Пункт №1
Описание пункта №1
Пункт №2
Описание пункта №2
Пункт №3
Описание пункта №3

CSS добавление двоеточия


Список

Результат:
Ширина:
326 мм
Высота:
223 мм
Гарантия:
6 мес.
Дополнительно:
Цвет - серый, вес - 5кг

Список фиксированной шириной

Результат:
Ширина:
826 мм
Высота:
523 мм
Гарантия:
12 мес.
Дополнительно:
Цвет - серый, вес - 5кг

Список с пунктирной линией

Результат:
Ширина:
826 мм
Высота:
523 мм
Гарантия:
12 мес.
Дополнительно:
Цвет - серый, вес - 5кг

Таблица

Результат:
Ширина:
326 мм
Высота:
123 мм
Гарантия:
24 мес.
Дополнительно:
Цвет - серый, вес - 5кг

Полосатая таблица

Результат:
Ширина:
126 мм
Высота:
23 мм
Гарантия:
12 мес.
Дополнительно:
Цвет - серый, вес - 5кг
Помогла ли вам статья?
Да Нет
357 раз уже помогла
Комментарии: (0)

КАТЕГОРИИ