2070 / HTML / Список

1. перелік (список) об'єктів
2. меню

Ненумерований

<ul>
  <li>Чай</li>
  <li>Кофе</li>
  <li>Шоколад</li>
</ul>
 

<ul type="disc"> темні кружечки, маркер за замовчуванням
<ul type="circle"> круги
<ul type="square"> квадрати
<ul type="none"> нічого
style="list-style-type:disc"

 
Нумерований

<ol>
  <li>Чай</li>
  <li>Кофе</li>
  <li>Шоколад</li>
</ol>

<ol type="1"> 1, 2, 3, ...
<ol type="A"> A, B, C, ...
<ol type="a"> a, b, c, ...
<ol type="I"> I, II, III, IV, V, ...
<ol type="i"> i, ii, iii, iv, v, ...

 
Список в списку

<ol>
  <li id="id1">1
    <ul>
      <li>1</li>
      <li>2</li>
      <li>3</li>
    </ul>
  </li> <!-- або закрити біля 1 -->
  <li id="id2">2
    <ul>
      <li>11</li>
      <li>22</li>
      <li>33</li>
    </ul>
  </li>
  <li id="id3">3
    <ul>
      <li>111</li>
      <li>222</li>
      <li>333</li>
    </ul>
  </li>
</ol>


#id1 { color:#ff0000; }
#id2 { color:#00ff00; }
#id3 { color:#0000ff; }


 

#id1 { list-style-image:url(img/planet.png);}


 

#id1 li { list-style-image:url(img/planet.png);}


 
 
#id1 li li { list-style-image:url(markers/planet.png);} - на третьому рівні