Documente Academic
Documente Profesional
Documente Cultură
Introducción
• Máquina Servidor
Servidor web (Apache, IIS, etc.)
Lenguaje HTML
Estructura HTML
<HTML>
<HEAD>
</HEAD>
<BODY>
Hola Mundo!
</BODY>
</HTML>
Estructura HTML
Ejercicio 1
HTML: Tablas
• Ej.:
<TABLE>
<TR><TD>Fila 1 Columna 1</TD> <TD> Fila 1 Columna 2 </TD></TR>
<TR><TD>Fila 2 Columna 1</TD> <TD> Fila 2 Columna 2 </TD></TR>
</TABLE>
• El navegador mostrará:
<TABLE BORDER=“1”>
<TR><TD COLSPAN=“2”>Fila 1 ocupa 2 columnas</TD></TR>
<TR><TD>Fila 2 Columna 1</TD> <TD> Fila 2 Columna 2 </TD></TR>
</TABLE>
• El navegador mostrará:
HTML: Tablas
• Tablas Multifilas:
<TABLE BORDER="1">
<TR><TD ROWSPAN=2>Celda 1 Ocupa 2 Filas</TD><TD>Fila 1
Columna 2</TD></TR>
<TR><TD>Fila 2 Columna 2</TD></TR>
</TABLE>
• El navegador mostrará:
HTML: Atributos de Tablas
• Las tablas pueden ser adicionalmente formateadas a partir
de los atributos que nos ofrece la propia etiqueta <table>
align Alinea horizontalmente la tabla con respecto a su
entorno.
bgcolor Da color de fondo a la tabla.
border Define el número de pixels del borde principal.
cellpadding Define, en pixels, el espacio entre los bordes
de la celda y el contenido de la misma.
cellspacing Define el espacio entre los bordes (en pixels).
height Define la altura de la tabla en pixels o porcentaje.
width Define la anchura de la tabla en pixels o porcentaje.
• El navegador mostrará:
Ejercicio 2
HTML: Formularios
HTML: Formularios
• INPUT: Es una de las directivas que permite especificar algunas clases
de campos de entrada, dependiendo de los atributos asociados:
• CHECKBOX:
<INPUT TYPE=checkbox NAME="so" VALUE="msdos">MS-OS
<INPUT TYPE=checkbox NAME="so" VALUE="os2">OS/2
<INPUT TYPE=checkbox NAME="so" VALUE="unix">UNIX
HTML: Formularios
•RADIO:
<input type=radio name="sexo" value="hombre">Hombre
<input type=radio name="sexo" value="mujer">Mujer
• PASSWORD:
<input type=password name="passwd">
• HIDDEN:
<input type=“hidden” name=“oculto“ value=“1”>
No se visualiza
HTML: Formularios
• Directiva SELECT: Se utiliza para definir listas de opciones dentro de un
formulario. El atributo NAME, comentado en la directiva INPUT, se utiliza de la
misma forma. Para especificar cada elemento de la lista u opción se utiliza la
directiva <OPTION> indicando a continuación el texto de la opción.
Se visualizará:
HTML: Formularios
• Directiva TEXTAREA: Permite crear una zona de texto especificando el
número de filas (atributo ROWS) y de columnas (atributo COLS) de la ventana. Si
se desea especificar un texto, se hará entre la directiva de apertura y la de cierre.
Ejemplo:
Se visualizará:
Ejercicio 3
• Usando el documento HTML del Ejercicio 2, generar un documento
HTML, llamado formulario.html con la siguiente estructura:
FIN
• ¿Preguntas?