Listas
Listas
As listas existen dende sempre na linguaxe HTML, vexamos os tipos existentes:
Listas non numeradas
As listas non numeradas empréganse para coleccións de elementos relacionados que aparecen sen ningún tipo de orde determinada. En (X)HTML as listas non numeradas indícanse co elemento <ul> (Unnumbered List). O contido dun <ul> limítase a un ou máis elementos de lista <li> (List Item). Estes elementos de lista son elementos de bloque, polo que sempre se mostrarán nunha nova liña.
- ul:
- <ul> ... </ul>
- Atributos: id, class, style, title
- Atributos obsoletos:
- - compact
- - type="disc | circle | square"
- li:
- <li> ... </li>
- Atributos: id, class, style, title
- Atributos obsoletos:
- - type="formato"
- - value="número"
Exemplo:
<ul>
<li>Listas non numeradas</li>
<li>Listas numeradas</li>
<li>Listas de definición</li>
</ul>
- Recordade que en (X)HTML é obrigatorio pechar todas as etiquetas.
Listas numeradas
As listas numeradas empréganse para listas nas que a secuencia dos elementos é importante. As listas numeradas indícanse co elemento <ol> (Ordered List) e deben incluír un ou máis elementos de lista (<li>). Trátanse de elementos de bloque.
- ol:
- <ol> ... </ol>
- Atributos: id, class, style, title
- Atributos obsoletos:
- - compact
- - start="number"
- - type = "1 | A | a | I | i"
Exemplo:
<ol>
<li>Instalar o sistema operativo</li>
<li>Actualizar o sistema operativo</li>
<li>Instalar o resto do software</li>
</ol>
- Recordade que en (X)HTML é obrigatorio pechar todas as etiquetas.
Listas de definición
Este tipo emprégase para listas que consisten en parellas de termos e definicións. As listas de definición están marcadas como elementos <dl> (Definition List). O contido dun dl é algún número de termos (indicados polo elemento <dt> - Definition Term) e definicións (indicados polo elemento <dd>). O elemento dt (termo) só pode conter elementos en liña. Todos os elementos empregados nas listas de definición son elementos a nivel de bloque e comezarán por unha nova liña.
- dl:
- <dl> ... </dl>
- Atributos: id, class, style, title, compact
- dd:
- <dd> ... </dd>
- Atributos: id, class, style, title
A estrutura das listas de definición é algo distinta das listas vistas ata o de agora. Estas listas están compostas por elementos dt e dd, e estes elementos contidos nun elemento dl, tal e como pode verse no seguinte exemplo:
Exemplo:
<dl>
<dt>em</dt>
<dd>Indica texto enfatizado. Renderízase en cursiva.</dd>
<dt>strong</dt>
<dd>Indica texto moi enfatizado. Renderízase en negra.</dd>
</dl>
- Non é necesario que os termos e as definicións aparezan alternándose. Pódense introducir dous termos seguidos e logo unha definición (por exemplo).
Aniñar listas
Os elementos de listas poden aniñarse noutras listas. Por exemplo, pódese aniñar unha lista numerada nunha de definición, ou viceversa.
Vexamos un exemplo:
Sistemas Operativos:
<ol>
<li>Windows
<ul>
<li>Windows Vista</li>
<li>Windows XP</li>
<li>Windows 98</li>
</ul>
</li>
<li>Linux</li>
<li>MacOS X</li>
</ol>
O código anterior dará como resultado:
Sistemas Operativos:
- Windows
- Windows Vista
- Windows XP
- Windows 98
- Linux
- MacOS X
- Windows Vista
- Windows XP
- Windows 98