HTML - CSS - JS - PHP

środowisko XAMPP Ubuntu serwer 16.04.1 edytory dla programistów edytory grafiki

HTML

Lista znaczników
Lista atrybutów
Encje
Struktura strony WWW
Komentarze
Znaczniki naglówka
+ Znaczniki blokowe
+ Znaczniki wstawiane
+ Elementy osadzane
+ Formularze
Listy
Tabele
Hiperlacza

CO JEST POTRZEBNE

Hardware
Software

O JEZYKACH

HTML
CSS
JavaScript
PHP
SQL

CSS

JAVASCRIPT

Lokalizacja plików JS
Komentarz w JS
Operatory w JS
In/Dekrementacja
Deklaracja zmiennej Document.Write()

PHP

SQL

˂˂˂ Start

Strona startowa

Pobierz PDF

Wydrukuj

Listy w HTML

Lista wypunktowana tworzy formę w której kolejne linie zaczynają się od identycznego dla każdej linii punktu. Domyślnie jest to kropka, ale oczywiście istnieje możliwość wyboru dowolnego znaku, a nawet grafiki przy użyciu CSS 3. Poniżej zamieszczam fragment kodu HTML przedstawiający użycie listy wypunktowanej. W ramce po prawej widzimy efekt działania kodu z ramki po lewej.

_{˂!--początek listy wypunktowanej--˃}

 ˂ul˃
     ˂li˃tekst kolejnych punktów...˂/li˃
     ˂li˃tekst kolejnych punktów...˂/li˃	
     ˂li˃tekst kolejnych punktów...˂/li˃
 ˂/ul˃

1.1 Lista wypunktowana

tekst kolejnych punktów...

tekst kolejnych punktów...

tekst kolejnych punktów...

Lista numerowana różni się od listy wypunktowanej jedynie tym, że identyczny dla każdej pozycji symbol jest zastąpiony kolejną liczbą (domyślnie). Również i tu istnieje możliwość zmiany liczby na np. kolejną literę przy użyciu CSS 3.

_{˂!--początek listy numerowanej--˃}

 ˂ol˃
     ˂li˃tekst kolejnych punktów...˂/li˃
     ˂li˃tekst kolejnych punktów...˂/li˃	
     ˂li˃tekst kolejnych punktów...˂/li˃
 ˂/ol˃

1.2 Lista numerowana

tekst kolejnych punktów...

tekst kolejnych punktów...

tekst kolejnych punktów...

Listy definicji tym różnią się od list wypunktowanych i list numerowanych, że kolejnym znacznikiem takiej listy jest definicja. (słowo definiowane). Tekst definiujący zostaje umieszczony poniżej słowa definiowanego.

_{˂!--początek listy definicji--˃}

 ˂dl˃
     ˂dt˃Słowo definiowane˂/dt˃
	  ˂dd˃Definicja słowa...˂/dd˃	
     ˂dt˃Słowo definiowane˂/dt˃
	  ˂dd˃Definicja słowa...˂/dd˃		
     ˂dt˃Słowo definiowane˂/dt˃
	   ˂dd˃Definicja słowa...˂/dd˃		
 ˂/dl˃

1.3 Lista definicji

Słowo definiowane.: Definicja słowa...
Słowo definiowane.: Definicja słowa...
Słowo definiowane.: Definicja słowa...

Zagnieżdżanie list to nic innego jak informatyczna nazwa tworzenia list zawierających podpunkty, dodatkowe definicje i tym podobne. Zapewne przeglądając strony internetowe zauważyłeś, że listy bywają bardzo rozbudowane. Są listy będące połączeniem dwóch takich samych typów list jak i różnych typów, a nie można wykluczyć i takiej konstrukcji, że w obrębie jednej listy użyjemy wszystkich trzech typów list. Przykład taki jest pokazany poniżej.

_{˂!--początek listy zagnieżdżonej˃}

 
 ˂ol˃
     ˂li˃tekst kolejnych punktów 
		podstawowej listy 
		numerowanej...˂/li˃
	˂ul˃
	  ˂li˃tekst kolejnych, 
	  zagniedżonych punktów listy 
	  wypunktowanej...˂/li˃
	  ˂li˃tekst kolejnych, 
	  zagniedżonych punktów listy 
	  wypunktowanej...˂/li˃	
	˂/ul˃
     ˂li˃tekst kolejnych punktów 
		podstawowej listy 
		numerowanej...˂/li˃
	˂dl˃
		˂dt˃Słowo definiowane˂/dt˃
		˂dd˃Definicja słowa 
		zagnieżdżonej listy 
		definicji...˂/dd˃
	˂/dl˃
	˂ul˃
	  ˂li˃tekst kolejnych, 
	  zagniedżonych punktów listy 
	  wypunktowanej...˂/li˃
		˂dl˃  
	   ˂dt˃Słowo definiowane˂/dt˃
	  ˂dd˃Definicja słowa...˂/dd˃
	˂/dl˃	  
	  ˂li˃tekst kolejnych, 
	  zagniedżonych punktów listy 
	  wypunktowanej...˂/li˃
	  ˂li˃tekst kolejnych, 
	  zagniedżonych punktów listy 
	  wypunktowanej...˂/li˃
	˂/ul˃
    		
 
	 ˂li˃tekst kolejnych punktów...˂/li˃
 ˂/ol˃