26 Ene Practicando con listas ordenadas y listas no ordenadas | Ejercicio html
Posted at 07:30h in Tutorial HTML gratuito. Aprende a estructurar tus páginas web., Ejercicios HTML 1 Comment
En este ejercicio vamos a aplicar el concepto listas ordenadas y no ordenas en html.
Puedes repasar la teoría en esta publicación.
Enunciado
Escribe con html las listas según la imagen.
Solución del ejercicio
Usaremos los atributos type, reversed y start.
Tengamos en cuenta que el atributo type está deprecated en html5 pero que su uso es práctico. Por una vez haremos una excepción…
Resolución listas ordenadas
<h2>Listas ordenadas</h2>
<ol type="a" start="4">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ol>
<ol start="100" reversed="reversed">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ol>
<ol type="i" start="999">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ol>Resolución listas NO ordenadas
<h2>Listas no ordenadas</h2>
<ul type="disc">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
<ul type="circle">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>
<ul type="square">
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
<li>Elemento 4</li>
</ul>¡Hola!
Querido lector,
Espero que este ejercicio te haya ayudado a practicar con los atributos que pueden acompañar un elemento lista.
¡Si te ha gustado este contenido te animo a seguirme en mi perfil de empresa de Linkedin!
Entradas relacionadas:
Códigos HTML | Caracteres especiales (escapados)
¿Por qué se escapan los caracteres en html? ¿Que utilidad tiene complicarse con símbolos estraños? ¿Como los usamos? Apuntes de alumno HTML.
¿Por qué se escapan los caracteres en html? ¿Que utilidad tiene complicarse con símbolos estraños? ¿Como los usamos? Apuntes de alumno HTML.
Como hacer espacios en blanco con html
Has intentado separar palabras en blanco pulsando el espaciador? Seguramente has comprobado que no funciona. En esta publicación vemos un ejemplo de como se debe hacer con HTML.
Has intentado separar palabras en blanco pulsando el espaciador? Seguramente has comprobado que no funciona. En esta publicación vemos un ejemplo de como se debe hacer con HTML.
Corrige los errores que veas en la estructura web | Ejercicios html
Ejercicio html dónde se muestran errores comunes que cometemos al escribir documentos html. Incluye solución.
Ejercicio html dónde se muestran errores comunes que cometemos al escribir documentos html. Incluye solución.
Ejercicios resueltos sobre listas anidadas (encapsuladas) de html
3 ejercicios sobre listas anidadas en dificultad creciente. Incluye soluciones. ¿Te atreves a resolverlos a bolígrafo y papel?
3 ejercicios sobre listas anidadas en dificultad creciente. Incluye soluciones. ¿Te atreves a resolverlos a bolígrafo y papel?
Etiquetas básicas introductoras al html5
Existen 2 formas de aprender el html. Uno es ir desde las etiquetas más antiguas y obsoletas hacia las más modernas del html5 o viceversa. Yo soy partidario de aprender html5 directamente y hacer borr...
Existen 2 formas de aprender el html. Uno es ir desde las etiquetas más antiguas y obsoletas hacia las más modernas del html5 o viceversa. Yo soy partidario de aprender html5 directamente y hacer borr...
Como anidar etiquetas html correctamente
Un error típico en muchos alumnos de web es no anidar bien las etiquetas. Te resumo como hacerlo y dónde se suele equivocar la gente.
Un error típico en muchos alumnos de web es no anidar bien las etiquetas. Te resumo como hacerlo y dónde se suele equivocar la gente.
Francesc Ricart
Posted at 14:12h, 04 noviembreObservación: Edge no entiende el atributo reversed.