Array

Uso de una lista HTML en diseño web

El lenguaje HTML admite tres tipos diferentes de lista. De manera predeterminada, usan etiquetas estándar y renderizan de manera estándar, aunque un estilo más elaborado para cualquiera de estos elementos generalmente requiere una hoja de estilo.

Tres tipos de listas en HTML

HTML ofrece tres casos de uso para enumerar contenido en una página.

  • Listas ordenadas : a veces se llaman listas numeradas porque, por defecto, los elementos de la lista & amp; amp; nbsp; contenidos en esa lista tienen un orden o clasificación numérica específica. Las listas ordenadas son apropiadas cuando el orden exacto de los elementos es importante para el significado del contenido. Por ejemplo, una receta probablemente usaría una lista ordenada porque los pasos ocurren en secuencia. Cualquier proceso paso a paso se presenta mejor como una lista ordenada.
  • Listas desordenadas : a veces se llaman listas con viñetas porque la apariencia visual predeterminada de una lista desordenada es to & amp; amp; nbsp; tener pequeños iconos de viñeta delante de los elementos de la lista . Este tipo de lista se usa mejor cuando el orden de los artículos es & amp; apos; t saliente.& amp; amp; nbsp; Los elementos de la lista aparecerán en cualquier orden en que los codifique para el HTML, pero está determinando ese orden y, a diferencia de una receta o proceso paso a paso, el orden podría cambiarse y el significado del contenido no sufriría.
  • Listas de definición : son listas de elementos que tienen dos partes, un término a definir y la definición. Se usan comúnmente para mostrar un par de definición / descripción como lo encontraría en un diccionario, pero las listas de definición también se pueden usar para muchos otros tipos de contenido.

Listas en general

html list examples
html list examples
& lt; / img & gt ;

Con listas, todos los elementos se combinan con las etiquetas de apertura y cierre. Estos pares rigen tanto los marcadores de tipo de lista como los elementos de elemento de lista individuales.

Video destacado

Listas ordenadas

Use el & amp; amp; nbsp; & lt; strong / & gt ;

& lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt;

  1. etiqueta (el final & lt; fuerte / & gt;

& lt; strong / & gt; & amp; amp; nbsp; tag es obligatorio), para crear una lista numerada con números que comiencen en 1. & gt; 1t; t & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt;.& amp; amp; nbsp ;
& lt; p / & gt ;

El HTML se ve así:

& lt; pre / & gt ;

  1. Paso uno
  2. Paso dos
  3. Paso tres

& lt; br & gt ;

Y el resultado se ve así:

  1. Paso uno
  2. Paso dos
  3. Paso tres

Listas desordenadas

Use el & lt; strong / & gt ;

& lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & lt; fuerte / & gt; & lt; fuerte / & gt; & lt; fuerte / & gt;

  • & amp; amp; nbsp; tag (el final & amp; amp; nbsp; & lt; strong / & gt; tag es obligatorio) para crear una lista con viñetas en lugar de números. Al igual que con la lista ordenada, los elementos se crean con & lt; strong / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; fuerte / & gt;
  • & lt; li / & gt;

  • etiqueta par.

& lt; p / & gt ;

El HTML se ve así:

& lt; pre / & gt ;

  • Manzanas
  • Naranjas
  • Peras

& lt; br & gt ;

Y el resultado se ve así:

  • Manzanas
  • Naranjas
  • Peras

Listas de definición

Las listas de definiciones crean una lista con dos partes para cada entrada: el nombre o término a definir y la definición. Use & lt; fuerte / & gt ;

& lt; strong / & gt; & lt; strong / & gt; para crear la lista y usar & lt; strong / & gt; & lt; strong / & gt; para especificar el término y & lt; strong / & gt; & lt; strong / & gt;
& lt; p / & gt ;

El HTML se ve así:

& lt; pre / & gt; & lt; br & gt ;
Cat & lt; br & gt ;
Lindo animal de cuatro patas.& lt; br & gt ;
Internet & lt; br & gt ;
Comunidad en línea optimizada para fotos de gatos.& lt; br & gt ;
& lt; br & gt ;

Y el resultado se ve así:

example of a definition list
example of a definition list
& lt; / img & gt ;
& lt; / br & gt; & lt; / br & gt; & lt; / br & gt; & lt; / br & gt; & lt; / br & gt;

& lt; / br & gt ;

& lt; / br & gt ;

& amp; # x203A; Informática

Dejar respuesta

Please enter your comment!
Please enter your name here

FOLLOW US

Related Stories