viñetas tipos listas etiqueta desordenadas anidadas html semantics

tipos - cuándo usar UL u OL en html?



ol html (12)

Parece intercambiable?


Como la pregunta pregunta "cuándo usarlos", pensé que era apropiado ofrecer ejemplos de cuándo, generalmente decido usar OL cuando quiero una serie de pasos, y UL cuando quiero ofrecer opciones:

Lista ordenada

Aquí los pasos son críticos para el caso comercial, debemos seguir los pasos en este orden, por lo tanto, se utiliza una lista ordenada.

Etapas de compra en eCommerce, estos pasos serán en este orden.

<ol> <li>shipping</li> <li>billing</li> <li>summary</li> <li>confirmation</li> </ol>

Lista desordenada

Un usuario puede decidir sobre el orden en que elige interactuar con estas opciones

<ul> <li>Contact Us</li> <li>Newsletter Signup</li> <li>Terms</li> <li>Log out</li> </ul>


Con <ol> el orden de los datos es importante y se mostrará (de forma predeterminada) mientras que con <ul> , el orden no es tan importante. Ejemplo:

<p>Tomorrow I will</p> <ol> <li>Wake up</li> <li>Have breakfast</li> <li>Go to sleep</li> </ol> <p>During breakfast, I will eat</p> <ul> <li>Butter</li> <li>Eggs</li> <li>Bacon</li> </ul>


Creo que es un tema sematic, ya que los puntos de numeración / viñetas pueden cambiarse por CSS.

Las listas ordenadas deben ser cosas como instrucciones o cualquier información secuencial.

Las listas desordenadas deben ser todo lo demás.


En algunos casos (específicamente utilizado por lectores de pantalla para personas con necesidades especiales) es posible que desee tener una lista ordenada pero no tener números asociados debido al diseño visual. Ex. cuando digite las instrucciones en una página para completar un formulario y desee que los lectores de pantalla aprovechen los elementos pedidos en las instrucciones, será útil. Para todos los efectos visuales, se puede hacer que se vean exactamente iguales a través de CSS. Son las semánticas (no visuales, pero útiles para el lector de pantalla) que son diferentes y a veces útiles.


Jaja, muchas respuestas!

Cuando apareció por primera vez HTML, estaban OL y UL , lo que, como todos los otros carteles han dicho, significaba Lista ordenada y Lista desordenada.

La diferencia fue fácil. OLs muestra ... un número al lado de ellos. ¡O un número romano, o una letra! ¡Incluso podría controlar si usaba símbolos en mayúscula o minúscula! ¡Guay!

Las UL te dieron balas. 3 tipos de balas, incluso: discos (círculos huecos), cuadrados (cuadrados rellenos), círculos (círculos rellenos).

No hubo CSS Más allá de estos atributos, no había realmente una manera de personalizar los formatos de lista (y los márgenes e indentaciones y todo lo demás). Por lo tanto, esta distinción era importante.

Hoy en día, es todo CSS. De hecho, las personas w3 quieren que uses estilos en lugar del atributo "tipo" html que solías usar. Entonces, usar UL vs OL realmente no importa, si usted es uno de los usuarios de CSS novedosos.

CSS le permite cambiar el tipo de viñeta, u optar por usar una imagen, o cambiar los márgenes / estilos / sangrías, o incluso no mostrar una viñeta.

Editar de nuevo: esta respuesta no pretende realmente abordar los méritos semánticos de UL versus OL. Pero técnicamente (ya sabes, en los bits y bytes), lo anterior describe las diferencias en el comportamiento.


OL:

  1. Artículo de lista 1
  2. Artículo de lista 2

UL:

  • Artículo de lista 1
  • Artículo de lista 2

OL es una lista ordenada, UL es lista desordenada


UL significa "lista desordenada". OL significa "lista ordenada".

UL te consigue puntos. OL obtiene tus números.

Definitivamente no intercambiable.


Una es lista ordenada (OL), es para cosas que tienen un orden definido y distinto. Hay una razón detrás de por qué están organizados.

El otro (UL) es la lista desordenada, que es solo una colección de cosas en un orden no especificado. Su organización es trivial.


Use OL cuando enumera los pasos que deben realizarse en un orden determinado. Use UL cuando haga una lista de artículos sin un orden particular de importancia.


ul significa lista no ordenada. Es para listas en las que no importa en qué orden estén los elementos de la lista.

ol significa lista ordenada. Es para listas que están numeradas o de alguna manera muestran que tienen un orden específico.

Por defecto, UL obtiene listas con viñetas y listas numeradas, aunque esto se puede editar en CSS.


http://techuap.com/category/tips/computer-programming-tips

Use OL cuando enumera los pasos que deben realizarse en un orden determinado. Use UL cuando haga una lista de artículos sin un orden particular de importancia. Por defecto, UL obtiene listas con viñetas y listas numeradas, aunque esto se puede editar en CSS. gracias ..


En términos matemáticos (hey, ¿por qué no?), Un <ol> representa una secuencia, mientras que <ul> representa un conjunto. Reordenar los elementos en una lista ordenada cambia el significado de la lista. Reordenarlos en una lista desordenada no.

Esta es una buena regla empírica para saber qué tipo de lista usar. Si cambiar el orden de los elementos hace que la lista sea incorrecta, quiere usar <ol> . Si el pedido no importa, use <ul> .