Przejdź do treści

Tekst

Wykaz

(lista wyliczeniowa)

wyświetlanie: w bloku

Wypunktowanie (podstawowy) - lista nieuporządkowana

<ul>
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ul>

Zwracam uwagę, że w obrębie wykazu tekst i inne elementy można wstawiać tylko wewnątrz znaczników punktów wykazu, a nie poza nimi! Zatem poniższy kod będzie nieprawidłowy:

<ul>
Wykaz...
<li>Punkt pierwszy</li>
<br />
<li>Punkt drugi</li>
<br />
</ul>

Przykład:

  • Punkt pierwszy
  • Punkt drugi
  • Punkt trzeci

Wypunktowanie - różne typy

<ul type="rodzaj">
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ul>
gdzie jako "rodzaj" należy podać:
  • "disc" - (domyślny) - koło
  • "circle" - okrąg
  • "square" - wypełniony kwadrat

Atrybut TYPE jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.

Przykład:

  • disc (domyślny)
  • circle
  • square

Wykaz numerowany (podstawowy) - lista uporządkowana

<ol>
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ol>

Przykład:

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

Wykaz numerowany - różne typy

<ol type="rodzaj numeracji">
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ol>
gdzie jako "rodzaj numeracji" należy podać:
  • "1" (domyślny) - numeracja według liczb arabskich
  • "I" - według dużych liczb rzymskich
  • "i" - według małych liczb rzymskich
  • "a" - według małych liter
  • "A" - według dużych liter

Atrybut TYPE jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.

Przykład:

<ol type="1"> (domyślny)

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

<ol type="I">

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

<ol type="i">

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

<ol type="A">

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

<ol type="a">

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

Wykaz numerowany z podaniem początkowego numeru

<ol start="n">
<li>Punkt pierwszy</li>
<li>Punkt drugi</li>
<li>Punkt trzeci</li>
</ol>
gdzie jako "n" należy podać liczbę, od której ma się rozpocząć numerowanie.

Wartość atrybutu START zawsze musi być liczbą, nawet jeśli numerowanie następuje według liter!

Atrybut START jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.

Przykład:

Przykład

Zmiana numerowania "w trakcie"

<ol>
<li>Punkt pierwszy</li>
<li value="n">Punkt drugi</li>
<li>Punkt trzeci</li>
</ol>
gdzie jako "n" należy podać zmieniony numer punktu (następne punkty będą numerowane według zmienionej kolejności).

Wartość atrybutu VALUE zawsze musi być liczbą, nawet jeśli numerowanie następuje według liter!

Atrybut VALUE jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.

Przykład:

Przykład

Edytory (X)HTML posiadają często specjalny generator wykazów, który może ułatwić pracę.

Stosując pewną "sztuczkę", można uzyskać wykaz, którego wyróżniki (markery) będą miały inny kolor niż reszta tekstu:

<ul style="color: red">
<li><span style="color: black">Punkt pierwszy</span></li>
<li><span style="color: black">Punkt drugi</span></li>
<li><span style="color: black">Punkt trzeci</span></li>
</ul>
gdzie w miejsce wyróżnionych wyrazów należy wpisać definicje kolorów, przy czym "red" oznacza kolor, jaki mają przyjąć wyrózniki, natomiast "black" - kolor tekstu.
  • Punkt pierwszy
  • Punkt drugi
  • Punkt trzeci

Dotyczy to wszystkich typów wykazu:

  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci
  1. Punkt pierwszy
  2. Punkt drugi
  3. Punkt trzeci

Możliwe jest również określenie innego koloru dla każdego punktu wykazu:

<ul>
<li style="color: red"><span style="color: black">Punkt pierwszy</span></li>
<li style="color: green"><span style="color: black">Punkt drugi</span></li>
<li style="color: blue"><span style="color: black">Punkt trzeci</span></li>
</ul>
  • Punkt pierwszy
  • Punkt drugi
  • Punkt trzeci

Na koniec ważna wskazówka. Często może się zdarzyć tak, że chcemy umieścić wykaz wewnątrz paragrafu. Efekt będzie prawdopodobnie inny niż oczekiwaliśmy. Paragraf nie jest zwykłym elementem blokowym, ponieważ nie może zawierać innych elementów blokowych (m.in. wykazów). Zakończy się on po napotkaniu pierwszego elementu blokowego, nawet przed znacznikiem zamykającym </p>. W języku HTML nie jest to błąd, natomiast w XHTML już tak.

Przykład:

Po wpisaniu:

<p align="center">
Tu rozpoczyna się paragraf...
<ul>
<li>Punkt pierwszy wykazu</li>
<li>Punkt drugi wykazu...</li>
</ul>
...tu powinien skończyć się paragraf.
</p>

otrzymamy:

Tu rozpoczyna się paragraf...

  • Punkt pierwszy wykazu
  • Punkt drugi wykazu...

...tu powinien skończyć się paragraf.

Jak widać paragraf zakończył się przed wykazem, ponieważ ostatnia linijka nie została ustawiona na środku (tak jak pierwsza). Aby to zmienić, należy rozpocząć nowy paragraf tuż za wykazem i określić dla niego odpowiednie atrybuty lub ewentualnie zamiast paragrafu użyć bloku.

Zobacz także

Więcej tematów

Dotacje

Pomogła Ci ta strona? Chcesz, aby dalej się rozwijała?
Dotpay - Bezpieczne transakcje internetowePayPalWpłać dobrowolną dotację...