SlideShare una empresa de Scribd logo
1 de 3
Descargar para leer sin conexión
Ejemplo
El siguiente ejemplo muestra que etiquetas se deben usar para el uso de listas en nuestra
pagina web además agregamos listas con imágenes.
<html>
<head>
<title>Segundo taller HTML</title>
</head>
<body bgcolor="#E6E8FA">
<h4> Listas</h4>
<ul>
<li type="circle">Base de datos.</li>
<li type="square">Cibernetica.</li>
<li type="disc">robotica.</li>
<li type="circle">hipertexto.</li>
</ul>
<h4>Listas Ordenadas</h4>
<ol>
<li >Base de datos.</li>
<li >Cibernetica.</li>
<li >robotica.</li>
<li >hipertexto.</li>
</ol>
<h4>Listas Ordenadas</h4>
<ol>
<li value="20">Wap. </li>
<li >Java.</li>
<li >C++.</li>
<li >UML.</li>
</ol>
<h2>Lista con enlaces</h2>
<ol>
<li><a href="http://www.w3.org/">Word wide web</a>
<li><a href="http://www.oracle.com/index.html">Oracle</a>
<li><a href="http://www.apple.com/">Apple</a>
<li><a href="http://www.youtube.com/">youtube</a>
</ol>
<h2>Lista con imagenes </h2>
<dl>
<dt><img src="firefox.jpg">Mozilla Fire Fox
<dt><img src="chrome.jpg">Google Chrome
</dl>
<h2>Lista con imagenes y enlaces</h2>
<dl>
<dt>
<a href="http://www.opera.com/"><img src="opera.jpg"width="400"
height="300"alt="ir a la pagina web de opera"></a>Opera
<dt>
<a href="http://windows.microsoft.com/es-ES/internet-explorer/products/ie/home">
<img src="explorer.jpg"width="400"height="350"alt="ir a Explorer"></a>Explorer
</dl>
</body>
</html>
Como resultado el navegador muestra el siguiente ejemplo:
Listas en HTML

Más contenido relacionado

Similar a Listas en HTML

Similar a Listas en HTML (20)

Html 1
Html 1Html 1
Html 1
 
Listas ordenadas y listas no ordenadas
Listas ordenadas y listas no ordenadasListas ordenadas y listas no ordenadas
Listas ordenadas y listas no ordenadas
 
Ls1 pd2-210919171605
Ls1 pd2-210919171605Ls1 pd2-210919171605
Ls1 pd2-210919171605
 
Lab-01-PD2-HTML
Lab-01-PD2-HTMLLab-01-PD2-HTML
Lab-01-PD2-HTML
 
Tags en html
Tags en htmlTags en html
Tags en html
 
MEJORES - Curso-HTML-+-CSS.pdf
MEJORES - Curso-HTML-+-CSS.pdfMEJORES - Curso-HTML-+-CSS.pdf
MEJORES - Curso-HTML-+-CSS.pdf
 
Curso-HTML--CSS.pdf
Curso-HTML--CSS.pdfCurso-HTML--CSS.pdf
Curso-HTML--CSS.pdf
 
Listas
ListasListas
Listas
 
Ejercicios de HTML
Ejercicios de HTMLEjercicios de HTML
Ejercicios de HTML
 
Proyecto final
Proyecto finalProyecto final
Proyecto final
 
Etiquetas para estructurar texto en HTML - 3 parte
Etiquetas para estructurar texto en HTML - 3 parteEtiquetas para estructurar texto en HTML - 3 parte
Etiquetas para estructurar texto en HTML - 3 parte
 
Listas
ListasListas
Listas
 
Guia 3 10 2019
Guia 3 10 2019Guia 3 10 2019
Guia 3 10 2019
 
Html 1
Html 1Html 1
Html 1
 
FICHA 3.pdf
FICHA 3.pdfFICHA 3.pdf
FICHA 3.pdf
 
Listas de definición en HTML
Listas de definición en HTMLListas de definición en HTML
Listas de definición en HTML
 
Presentacion css
Presentacion cssPresentacion css
Presentacion css
 
HTML
HTMLHTML
HTML
 
Guia 3 10 2019
Guia 3 10 2019Guia 3 10 2019
Guia 3 10 2019
 
Drupal Workshop
Drupal WorkshopDrupal Workshop
Drupal Workshop
 

Más de OVAWEB (9)

Mantener valores en los campos de texto de un formulario PHP
Mantener valores en los campos de texto de un formulario PHPMantener valores en los campos de texto de un formulario PHP
Mantener valores en los campos de texto de un formulario PHP
 
Ejemplo validación
Ejemplo validaciónEjemplo validación
Ejemplo validación
 
Ejemplo de formulario
Ejemplo de formularioEjemplo de formulario
Ejemplo de formulario
 
Ejemplo de clases en css
Ejemplo de clases en cssEjemplo de clases en css
Ejemplo de clases en css
 
Ejemplo de css
Ejemplo de cssEjemplo de css
Ejemplo de css
 
Los Formularios en HTML
Los Formularios en HTMLLos Formularios en HTML
Los Formularios en HTML
 
Las Tablas en HTML
Las Tablas en HTMLLas Tablas en HTML
Las Tablas en HTML
 
Imágenes en HTML
Imágenes en HTMLImágenes en HTML
Imágenes en HTML
 
Párrafos en HTML
Párrafos en HTMLPárrafos en HTML
Párrafos en HTML
 

Último

Criterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficiosCriterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficios
JonathanCovena1
 
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdfCurso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Francisco158360
 
La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...
JonathanCovena1
 

Último (20)

Presentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza MultigradoPresentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza Multigrado
 
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niñoproyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
 
Criterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficiosCriterios ESG: fundamentos, aplicaciones y beneficios
Criterios ESG: fundamentos, aplicaciones y beneficios
 
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdfTema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
 
Imperialismo informal en Europa y el imperio
Imperialismo informal en Europa y el imperioImperialismo informal en Europa y el imperio
Imperialismo informal en Europa y el imperio
 
plande accion dl aula de innovación pedagogica 2024.pdf
plande accion dl aula de innovación pedagogica 2024.pdfplande accion dl aula de innovación pedagogica 2024.pdf
plande accion dl aula de innovación pedagogica 2024.pdf
 
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
ACERTIJO DE LA BANDERA OLÍMPICA CON ECUACIONES DE LA CIRCUNFERENCIA. Por JAVI...
 
Estrategia de prompts, primeras ideas para su construcción
Estrategia de prompts, primeras ideas para su construcciónEstrategia de prompts, primeras ideas para su construcción
Estrategia de prompts, primeras ideas para su construcción
 
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdfCurso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
 
ACERTIJO DE POSICIÓN DE CORREDORES EN LA OLIMPIADA. Por JAVIER SOLIS NOYOLA
ACERTIJO DE POSICIÓN DE CORREDORES EN LA OLIMPIADA. Por JAVIER SOLIS NOYOLAACERTIJO DE POSICIÓN DE CORREDORES EN LA OLIMPIADA. Por JAVIER SOLIS NOYOLA
ACERTIJO DE POSICIÓN DE CORREDORES EN LA OLIMPIADA. Por JAVIER SOLIS NOYOLA
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docx
 
La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.La triple Naturaleza del Hombre estudio.
La triple Naturaleza del Hombre estudio.
 
Ley 21.545 - Circular Nº 586.pdf circular
Ley 21.545 - Circular Nº 586.pdf circularLey 21.545 - Circular Nº 586.pdf circular
Ley 21.545 - Circular Nº 586.pdf circular
 
plan de capacitacion docente AIP 2024 clllll.pdf
plan de capacitacion docente  AIP 2024          clllll.pdfplan de capacitacion docente  AIP 2024          clllll.pdf
plan de capacitacion docente AIP 2024 clllll.pdf
 
La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...La empresa sostenible: Principales Características, Barreras para su Avance y...
La empresa sostenible: Principales Características, Barreras para su Avance y...
 
PIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonablesPIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonables
 
Sesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronósticoSesión de clase: Fe contra todo pronóstico
Sesión de clase: Fe contra todo pronóstico
 
Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...Caja de herramientas de inteligencia artificial para la academia y la investi...
Caja de herramientas de inteligencia artificial para la academia y la investi...
 
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
LABERINTOS DE DISCIPLINAS DEL PENTATLÓN OLÍMPICO MODERNO. Por JAVIER SOLIS NO...
 
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdfSELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
SELECCIÓN DE LA MUESTRA Y MUESTREO EN INVESTIGACIÓN CUALITATIVA.pdf
 

Listas en HTML

  • 1. Ejemplo El siguiente ejemplo muestra que etiquetas se deben usar para el uso de listas en nuestra pagina web además agregamos listas con imágenes. <html> <head> <title>Segundo taller HTML</title> </head> <body bgcolor="#E6E8FA"> <h4> Listas</h4> <ul> <li type="circle">Base de datos.</li> <li type="square">Cibernetica.</li> <li type="disc">robotica.</li> <li type="circle">hipertexto.</li> </ul> <h4>Listas Ordenadas</h4> <ol> <li >Base de datos.</li> <li >Cibernetica.</li> <li >robotica.</li> <li >hipertexto.</li> </ol> <h4>Listas Ordenadas</h4> <ol> <li value="20">Wap. </li> <li >Java.</li> <li >C++.</li> <li >UML.</li> </ol> <h2>Lista con enlaces</h2> <ol> <li><a href="http://www.w3.org/">Word wide web</a> <li><a href="http://www.oracle.com/index.html">Oracle</a> <li><a href="http://www.apple.com/">Apple</a> <li><a href="http://www.youtube.com/">youtube</a> </ol> <h2>Lista con imagenes </h2> <dl> <dt><img src="firefox.jpg">Mozilla Fire Fox <dt><img src="chrome.jpg">Google Chrome </dl>
  • 2. <h2>Lista con imagenes y enlaces</h2> <dl> <dt> <a href="http://www.opera.com/"><img src="opera.jpg"width="400" height="300"alt="ir a la pagina web de opera"></a>Opera <dt> <a href="http://windows.microsoft.com/es-ES/internet-explorer/products/ie/home"> <img src="explorer.jpg"width="400"height="350"alt="ir a Explorer"></a>Explorer </dl> </body> </html> Como resultado el navegador muestra el siguiente ejemplo: