Trabajo Practico Lenguajes de Programacion

El siguiente código permite crear una página Web con un formulario para cargar datos personales y enviarlos por correo electrónico a través del Outlook Express.

Actividad 1

. Copiar el siguiente código en forma textual en “FrontPage”. Analizar la estructura del código copiado teniendo en cuenta las palabras propias del lenguaje HTML y los signos de puntuación usados.

Una vez copiado y analizado , intententen modificar  algunos parámetros sin cambiar la estructura principal del código y verificar los efectos que dichos cambios producen

<HTML>

<HEAD><TITLE>FORMULARIO PERSONALIZADO</TITLE>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<STYLE>

 BODY {

 scrollbar-face-color:maroon;

scrollbar-highlight-color:green; scrollbar-3dlight-color:blue;

scrollbar-darkshadow-color:black; scrollbar-shadow-color:white;

scrollbar-arrow-color:white; scrollbar-track-color:black;

color : yellow;

font-size : 12pt;}

</STYLE></HEAD>

<font color="lime" size="5">* * * Formulario Personalizado * * *</font>

<BODY BGCOLOR=black>

<form action="mailto:corpol@hotmail.com" method="post" enctype="text/plain">

Nombre <input type="text" name="nombre" size="17" maxlength="70" style="background: navy;border:1px solid gold;color:white;font-weight:bold;">

Email <input type="text" name="email" size="20" maxlength="70" value="@" style="background: navy;border:1px solid gold;color:white;font-weight:bold;">

<br><br>

País <input type="text" name="país" size="20" maxlength="60" style="background: navy;border:1px solid gold;color:white;font-weight:bold;">

Ciudad <input type="text" name="ciudad" size="19" maxlength="60" style="background: navy;border:1px solid gold;color:white;font-weight:bold;">

<br><br>

Sexo

<br>

<input type="radio" name="sexo" value="Varon" checked> Hombre

<br>

<input type="radio" name="sexo" value="Hembra"> Mujer

<br>

<br>

Cuantas veces te conectas Internet

<br>

<select name="utilizacion" style="background: silver;border:2px solid gold;color:purple;">

    <option value="1" style="background: black;border:1px solid gold;color:aqua;">Varias veces al dia

    <option value="2" style="background: black;border:1px solid gold;color:aqua;">Una vez al dia

    <option value="3" style="background: black;border:1px solid gold;color:aqua;">Varias veces a la semana

    <option value="4" style="background: black;border:1px solid gold;color:aqua;">varias veces al mes

</select>

<br>

<br>

Comentarios sobre esta Web personal

<br>

<textarea cols="30" rows="7" name="comentarios" style="background: black;border:1px solid gold;color:lime; font-size: 15px;"></textarea>

<br><br>

<input type="submit" value="Enviar formulario" style="background: maroon;border: 1px solid lime;color:white;font-weight:bold;">

<input type="Reset" value="Borrar todo" style="background: maroon;border:1px solid lime;color:white;font-weight:bold;">

</form>

</BODY>

</HTML>

Importante: A continuación se presenta un glosario con palabras clave del lenguaje de programación HTML para tener en cuenta en futuros trabajos.

Glosario

Tags Básicos

<html></html> Crea un documento HTML

<head></head> Setea el título y otra información que no se visualizará en la página web

<body></body> Setea la parte visible de la página

Header Tags

<title></title> Pone el nombre del documento en la barra del título

Atributos del Body

<body bgcolor=?> Setea el color de fondo, usando nombres o valores hex

<body text=?> Setea el color del texto, usando nombres o valores hex

<body link=?> Setea el color de los enlaces, usando nombres o valores hex

<body vlink=?> Setea el color de los enlaces visitados, usando nombres o valores hex

<body alink=?> Setea el color de los enlaces al ser presionados, usando nombres o valores hex

Tags de texto

<pre></pre> Crea texto preformateado

<hl></hl> Crea un título grande

<h6></h6> Crea un título pequeño

Crea texto en negritas

Crea texto en itálicas

<tt></tt> Crea texto teletipo

<cite></cite> Crea una cita, usando itálicas

Enfatiza una palabra

Enfatiza una palabra (con itálicas or negritas)

Setea el cuerpo de la fuente de 1 a 7

Setea el color de la fuente, usando nombres o valores hex

Enlaces

<a href="URL"></a> Crea un hipervínculo

<a href="mailto:EMAIL"></a> Crea un enlace de email

<a name="NAME"></a> Crea un enlace dentro del documento

<a href="#NAME"></a> Vincula a ese target dentro del documento

Formatting

Crea un párrafo nuevo

Alinea un párrafa (izquierda, centro, derecha)

Inserta un salto de línea

<blockquote> </blockquote> Justifica el texto a ambos lados

<dl></dl> Crea un lista de definición

<dt> Precede cada término de definición

<dd> Precede cada definición

<ol></ol> Crea un lista numerada

<li></li> Precede cada ítem de una lista y le agrega un número

<ul></ul> Crea una lista con puntos

<div align=?> Un tag genérico utilizado para formatear grandes bloques de HTML, también usado para stylesheets

Elementos Gráficos

<img src="name"> Agrega una imagen

<img src="name" align=?> Alinea una imagen an image

<img src="name" border=?> Setea el grosor del borde de la imagen

<hr> Inserta una linea horizontal

<hr size=?> Setea la altura de una linea

<hr width=?> Setea el ancho de la linea, en porcentaje o números absolutos

<hr noshade> Inserta una linea horizontal sin sombra

Frames

<frameset></frameset> tag dentro de un documento de frames

<frameset rows="value,value"> Define las filas de un frame, usando números o porcentaje para definir el largo

<frameset cols="value,value"> Define las columnas de un frame, usando números o porcentaje para definir el largo

<frame> Define un solo frame - o región - dentro de frameset

<noframes></noframes> Define lo que aparecerá en navegadores que no soporten frames

Atributos de los Frames

<frame src="URL"> Especifica que documento html será desplegado

<frame name="name"> Nombra al frame or región, para que pueda ser llamado desde otro frame

<frame marginwidth=#> Define los márgenes derecho e izquierdo del frame; debe ser igual o mayor a 1

<frame marginheight=#> Define los márgenes de arriba y abajo del frame; debe ser igual o mayor a 1

<frame scrolling=VALUE> Setea si el frame tendrá barra de desplazamiento o no; el valor debe ser "yes," "no," o "auto. " El default es "auto".

<frame noresize> Previeve al usuario de cambiar el tamaño del frame

La Salle - Informatica Aplicada I y II

jueves, 4 de octubre de 2012

Trabajo Practico Lenguajes de Programacion

Datos personales

Archivo del blog