En este artículo, conoceremos la etiqueta HTML <ul> y su implementación. La etiqueta <ul> en HTML se usa para definir el elemento de la lista desordenada en un documento HTML. Contiene el elemento de elementos de lista <li>. La etiqueta <ul> requiere una etiqueta de apertura y cierre. Al usar el estilo CSS, puede diseñar fácilmente una lista desordenada.
Sintaxis:
<ul> list of items </ul>
Atributo aceptado: esta etiqueta contiene dos atributos que se enumeran a continuación:
- Atributo compacto HTML <ul> : hará que la lista sea más pequeña.
- Atributo de tipo HTML <ul> : Especifica qué tipo de marcador se utiliza en la lista.
Nota: los atributos <ul> no son compatibles con HTML 5.
Ejemplo: En este ejemplo, hemos creado una lista desordenada de partes de la computadora usando la etiqueta <ul>.
HTML
<!DOCTYPE html> <html> <body> <h2>Welcome To GeekforGeeks</h2> <ul> <li>Mouse</li> <li>Keyboard</li> <li>Speaker</li> <li>Monitor</li> </ul> </body> </html>
Producción:
Lista desordenada de HTML
Ejemplo 1: este ejemplo describe la lista desordenada en HTML.
HTML
<!DOCTYPE html> <html> <head> <title>HTML ul tag</title> </head> <body> <h1>GeeksforGeeks</h1> <h2>HTML ul tag</h2> <p>GeeksforGeeks courses List:</p> <ul> <li>Geeks</li> <li>Sudo</li> <li>Gfg</li> <li>Gate</li> <li>Placement</li> </ul> </body> </html>
Producción:
Lista desordenada de HTML
Ejemplo 2: lista desordenada anidada, una lista dentro de otras listas se conoce como lista anidada.
HTML
<!DOCTYPE html> <html> <head> <title>Nested unordered list</title> </head> <body> <h2>Welcome To GeeksforGeeks</h2> <ul> <li>Hardware</li> <li> Software <ul> <li>System Software</li> <li>Application Software</li> </ul> </li> <li>MacBook</li> </ul> </body> </html>
Producción:
Lista desordenada anidada
Ejemplo 3: Lista desordenada anidada compleja.
HTML
<!DOCTYPE html> <html> <head> <title>Nested unordered list</title> </head> <body> <h2>Welcome To GeeksforGeeks</h2> <ul> <li>Hardware</li> <li> Software <ul> <li>System Software</li> <li>Application Software</li> <ul> <li>Skype</li> <li>Slack</li> </ul> <li>Microsoft suite of products</li> <ul> <li>Office</li> <li>Excel</li> <li>Word</li> <li>Powerpoint</li> </ul> </ul> </li> <li>MacBook</li> </ul> </body> </html>
Producción:
Lista desordenada anidada compleja
Navegadores compatibles:
- Google Chrome
- explorador de Internet
- Borde de Microsoft
- Firefox
- Safari
- Ópera
Publicación traducida automáticamente
Artículo escrito por Sabya_Samadder y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA