Diseño y Elaboración de Páginas Web: Práctica 7

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° 1.

Introducción

En esta práctica se emplean las etiquetas de tablas para crear una estructura de información con filas y columnas, el documento creado muestra en orden el conteo de un pedido.

Código HTML

El código fuente resultante es el siguiente:

<html>
<head>
                               <title>Práctica 7 </title>
</head>
<body>
                <h1>Su pedido</h1>
                <table>
                               <tr>
                                               <td align="center"><b>Nombre producto</td>
                                               <td><b>Precio unitario</b></td>
                                               <td><b>Unidades</b></td>
                                               <td><b>Subtotal</b></td>
                               </tr>
                               <tr>
                                               <td>Reproductor MP3 (80 GB)</td>
                                               <td>192.02</td>
                                               <td>1</td>
                                               <td>192.02</td>
                               </tr>
                               <tr>
                                               <td>Fundas de colores</td>
                                               <td>2.50</td>
                                               <td>5</td>
                                               <td>12.50</td>
                               </tr>
                               <tr>
                                               <td>Reproductor de radio & control remoto</td>
                                               <td>12.99</td>
                                               <td>1</td>
                                               <td>12.99</td>
                               </tr>
                               <tr>
                                               <td align="center"><b>TOTAL</b></td>
                                               <td><b>-</b></td>
                                               <td><b>7</b></td>
                                               <td><b>207.51</b></td></b>
                               </tr>
                </table>
</body>

Explicación del código generado

En está practica se ocuparon las etiquetas para crear una tabla y ordenar un pedido por nombre del producto, precio unitario, unidades y subtotal; y a l fina de la tabla se muestra el total.
Para declarar una tabla se ocupa la etiqueta “<table>” con su etiqueta de cierre “</table>” ; para las columnas se utilizan las etiquetas “<tr> & </tr>”; y por ultimo, para las filas se ocupan las etiquetas “<td> & </td>”, esta va dentro de la etiqueta anterior y se ocupa tantas veces se desea de filas en la tabla.

El resultado de loa práctica es el siguiente:

Conclusión

Las tablas sirven para dar un orden a una información mediante filas y columnas, en html una tabla por default se no tiene ningún formato (borde, alineación, etc), el cual se puede dar a toda la tabla o solamente a una columna o fila.

URL de la practica

http://dewe.mypost.skn2.com/practicas/practica7.html

Diseño y Elaboración de Páginas Web

jueves, 21 de marzo de 2013

Práctica 7