Примеры: - часть 2

</body>

</html>

Этот пример показывает, как задать изображение в качестве маркера элемента списка. <html> <head> <style type="text/css"> ol { list-style-image: url("http://www.intuit.ru/departamen/speciality/image.gif") } </style> </head>

<body> <ol> <li>Первый элемент</li> <li>Второй элемент</li> </ol> </body>

</html>

Этот пример показывает, как можно задать расположение маркера элемента списка. <html> <head> <style type="text/css"> ol.in { list-style-position: inside }

ul.out { list-style-position: outside } </style> </head>

<body> <ol class="in"> <li>Это первый элемент списка</li> <li>Это второй элемент списка</li> <li>Это третий элемент списка</li> <pre>Cписок имеет <i><u>list-style-position</u></i> = "<b>inside</b>"</pre> </ol>

<ul class="out"> <li>Это первый элемент списка</li> <li>Это второй элемент списка</li> <li>Это третий элемент списка</li> </ul> <pre>Список имеет <i><u>list-style-position</u></i> = "<b>outside</b>"</pre> </body> </html>

Пример показывает, как задать все параметры списка в одном объявлении. <html> <head> <style type="text/css"> ol { list-style: disc outside url("http://www.intuit.ru/departament/speciality/image.gif") } </style> </head>

<body> <ol> <li>Первый элемент списка</li> <li>Второй элемент списка</li> <li>Третий элемент списка</li> </ol> </body>

</html>

Содержание Назад Вперед