Przejdź do treści

Tekst

Zagnieżdżanie wykazów

  1. Wypunktowanie (podstawowy)
    <ul>
    <li>Punkt pierwszy
    	<ul>
    	<li>Punkt 1.1
    		<ul>
    		<li>Punkt 1.1.1</li>
    		<li>Punkt 1.1.2</li>
    		</ul>
    	</li>
    	<li>Punkt 1.2</li>
    	</ul>
    </li>
    <li>Punkt drugi</li>
    </ul>
  2. Numerowanie
    <ol>
    <li>Punkt pierwszy
    	<ol>
    	<li>Punkt 1.1
    		<ol>
    		<li>Punkt 1.1.1</li>
    		<li>Punkt 1.1.2</li>
    		</ol>
    	</li>
    	<li>Punkt 1.2</li>
    	</ol>
    </li>
    <li>Punkt drugi</li>
    </ol>
  3. Wykaz mieszany - połączenie obu powyższych
We wszystkich przypadkach kolorem czerwonym zaznaczono wykaz nadrzędny (główny), zielonym - wykaz pierwszego stopnia zagnieżdżenia (podrzędny), natomiast niebieskim - drugiego stopnia zagnieżdżenia (najbardziej podrzędny).
Możliwe jest oczywiście dalsze zagnieżdżanie oraz mieszanie typów wykazów(wykaz mieszany).

Dzięki możliwości zagnieżdżania wykazów, można stworzyć listę punktów wraz z podpunktami. Podpunkty będą przesunięte bardziej w prawo w stosunku do punktów nadrzędnych, dzięki czemu wykaz będzie wyglądał bardziej czytelnie i estetycznie.

Zauważ, że w składni powyższych poleceń, wykazy bardziej zagnieżdżone są przesunięte w prawo - im bardziej podrzędny wykaz, tym większe jest wcięcie. Nie jest to konieczne, ale bardzo ułatwia zorientowanie się, na którym stopniu zagnieżdżenia aktualnie jesteśmy. Dlatego polecam używanie takiego sposobu wpisywania. Dobrze jest również na samym początku zamykać wszystkie znaczniki <ul>, <ol> oraz <li> (większość edytorów (X)HTML i tak robi to automatycznie), a dopiero potem wpisywać do nich wykazy podrzędne. Dzięki temu unikniemy błędnego wyświetlania, spowodowanego zapomnieniem zamknięcia znacznika.

Kod wykazów podrzędnych wpisuje się wewnątrz znacznika <li>...</li> wybranego punku wykazu nadrzędnego. Pomiędzy dwoma punktami wykazu, tzn. między znacznikami </li> a <li> nie można się znaleźć żaden kod ani tekst, ponieważ jest to błędem!

Przykład:

Wypunktowanie:

  • Punkt pierwszy
    • Punkt 1.1
      • Punkt 1.1.1
      • Punkt 1.1.2
    • Punkt 1.2
  • Punkt drugi

Numerowanie:

  1. Punkt pierwszy
    1. Punkt 1.1
      1. Punkt 1.1.1
      2. Punkt 1.1.2
    2. Punkt 1.2
  2. Punkt drugi

Wykaz mieszany:

  1. Punkt pierwszy
    1. Punkt I.1
      1. Punkt I.1.a
        • Punkt I.1.a.(1)
        • Punkt I.1.a.(2)
      2. Punkt I.1.b
    2. Punkt I.2
  2. Punkt drugi

A oto co należy wpisać, aby otrzymać ostatni wykaz:

<ol type="I">
<li>Punkt pierwszy
	<ol type="1">
	<li>Punkt I.1
		<ol type="a">
		<li>Punkt I.1.a
			<ul type="disc">
			<li>Punkt I.1.a.(1)</li>
			<li>Punkt I.1.a.(2)</li>
			</ul>
		</li>
		<li>Punkt I.1.b</li>
		</ol>
	</li>
	<li>Punkt I.2</li>
	</ol>
</li>
<li>Punkt drugi</li>
</ol>

Zobacz także

Komentarze

Zobacz więcej komentarzy