Основы работы с XHTML и CSS


Определение символов маркеров


Показанный в листинге 6.3 неупорядоченный список использует свойство list-style-type для вывода в качестве типа маркера окружности. Оформление задается во встроенной таблице стилей для селектора ul.

<style type="text/css"> ul {list-style-type:circle} </style>

<ul> <li>Элемент списка 1</li> <li>Элемент списка 2</li> <li>Элемент списка 3</li> </ul>

Листинг 6.2. Код для задания типа маркера° Элемент списка 1 ° Элемент списка 2 ° Элемент списка 3

Листинг 6.3. Неупорядоченный список с маркером-окружностью

Конечно, при использовании в таблице стилей простого селектора ul все неупорядоченные списки на странице будут иметь маркеры-окружности. Можно при желании применять селекторы ID, чтобы различным спискам можно было задать различные символы-маркеры. Следующая таблица стилей определяет три таких списка, каждый со своим собственным символом-префиксом.

<style type="text/css"> ul#List1 {list-style-type:disc} ul#List2 {list-style-type:circle} ul#List3 {list-style-type:square} </style>

Листинг 6.4. Встроенная таблица стилей для типов маркеров list-style

Определенная структура списка получает тип маркера, задавая соответствующий ID для своего тега <ul>. То есть список, определяемый с помощью тега <ul id="List3">, будет иметь в качестве маркера символ в виде квадрата.




Начало  Назад  Вперед



Книжный магазин