Colegio Nacional de Educación Profesional Técnica
Lic. "Jesus Reyes Heroles"
Nombre del Alumno: José Guadalupe Martínez Cruz
Módulo: Diseño y Elaboración de Páginas Web
Grupo: INFO-604.
Práctica: N° 6.
Práctica: N° 6.
Introducción
En está practica se edita el archivo índice.html de la carpeta portfolio ocupado en la practica 4 para colocarle las imágenes del proyecto en el mismo archivo, es decir, después del texto del proyecto se coloca su imagen y se elimina el vinculo.Código HTML
El código fuente resultante es el siguiente:
<html>
<head>
<title>Practica 6</title>
</head>
<body>
<a href="../indice.html">Volver a la pagina principal</a>
<h1>Ultimos proyectos</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Donec iaculis posuere justo. Nam vel neque.</p>
<h3>Proyecto 1</h3>
<p>Etiam consectetuer, mauris vitae cursus scelerisque,
dui turpis dignissim justo, et euismod enim odio sit amet erat.
</p><img src="./p4/imagenes/proyecto1.png" /><br />
<h3>Proyecto 2</h3>
<p>Etiam consectetuer, mauris vitae cursus scelerisque,
dui turpis dignissim justo, et euismod enim odio sit amet erat.
</p><img src="./p4/imagenes/proyecto2.jpg" /><br />
</body>
</html>
<head>
<title>Practica 6</title>
</head>
<body>
<a href="../indice.html">Volver a la pagina principal</a>
<h1>Ultimos proyectos</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Donec iaculis posuere justo. Nam vel neque.</p>
<h3>Proyecto 1</h3>
<p>Etiam consectetuer, mauris vitae cursus scelerisque,
dui turpis dignissim justo, et euismod enim odio sit amet erat.
</p><img src="./p4/imagenes/proyecto1.png" /><br />
<h3>Proyecto 2</h3>
<p>Etiam consectetuer, mauris vitae cursus scelerisque,
dui turpis dignissim justo, et euismod enim odio sit amet erat.
</p><img src="./p4/imagenes/proyecto2.jpg" /><br />
</body>
</html>
Explicación del código generado
Es el mismo código del archivo índice.html colocado en la carpeta portfolio, el cual se utilizó en la Práctica N° 4; pero se eliminaron los hipervínculos en el:<a href="./proyecto1.html">Ver imagen del Proyecto 1</a>
<a href="./proyecto2.html">Ver imagen del Proyecto 2</a>
Remplazándolos por imágenes de la siguiente manera con la etiqueta “<img src=”” />”:
<img src="./p4/imagenes/proyecto1.png" /><br />
<img src="./p4/imagenes/proyecto2.jpg" /><br />
El salto de línea (“<br/>”) es utilizado para separar las imágenes del texto.
gracias por compartir esta información sobre el diseño de paginas web
ResponderEliminar