Назад Вперед Зміст

Зміна положення маркера або номера

Тип маркера задається властивістю list-style-position для елементів <ol> і <ul>. Як значення цієї властивості вказується одне з двох ключових слів:

  1. outside, маркер (номер) виступає, утворюючи «висячий край» (за замовчуванням)
  2. inside, маркер не «звисає», тому кожен елемент списку має форму прямокутника.

Маркер виступає


<html>
<head>
<style type="text/css">
    u1 {
	    list-style-type:circle;
	    list-style-position:outside;
		}
</style>
</head>
<body>
<ul>
  <li>Поля розташовуються навколо елемента та являють собою проміжки між сусідніми елементами.</li>
  <li>Границі (рамки) підкреслюють контур елемента. Для блокових елементів границі завжди мають прямокутну форму.</li>
  <li>Відступи — це відстань між границями та вмістом. Без них вміст «наїжджатиме» на границі.</li>
  <li>Вміст — це внутрішнє наповнення елемента, тобто те, що розташоване між тегами.</li>
</ul>
</body>
</html>

Маркер не виступає


<html>
<head>
<style type="text/css">
    u1{
	    list-style-type:square;
	    list-style-position:inside;
		}
</style>
</head>
<body>
<ul>
  <li>Поля розташовуються навколо елемента та являють собою проміжки між сусідніми елементами.</li>
  <li>Границі (рамки) підкреслюють контур елемента. Для блокових елементів границі завжди мають прямокутну форму.</li>
  <li>Відступи — це відстань між границями та вмістом. Без них вміст «наїжджатиме» на границі.</li>
  <li>Вміст — це внутрішнє наповнення елемента, тобто те, що розташоване між тегами.</li>
</ul>
</body>
</html>

Назад Вперед Зміст