SUBMÓDULO III

		Función	Código HTML					Ejemplo
Marcas		Las marcas delimitan el tamaño y los elementos de un documento como cabeceras, párrafos, etc. y son utilizadas para dar un tratamiento diferente al texto que se encuentre entre las marcas.	<=abrir instrucción >=cerrar instrucción					<HTML> <Head> <TITLE> <BODY>
ESTRUCTURA DE LOS TEXTOS
Cabecera		La cabecera se emplea para facilitar información acerca del documento.		<Head> </head>			Dentro de la cabecera podemos destacar el título que indica el nombre del documento Explorador de internet Buscador “ejemplo” o “pagina” Código fuente
Cuerpo		El resto del documento residirá en esta parte.		<BODY> </BODY>			<HTML> <HEAD> <BODY> <title>…Bienvenido….</title> </BODY> </head> </HTML>
Encabezado		Los encabezados se emplean para dividir los documentos excepciones o más concretamente para marcar los títulos de esas secciones		<H1>….</H1> <H2>…..</H2> <H3>….</H3> <H4>….</H4>			<h1>Tamaño mayor </h1> <h6>Tamaño menor</h6>
DEFINICIÓN DE BLOQUES
Marcas		Función
<p>…….</p>		Se utiliza para separar párrafos dado que para el HTML todo el texto es continuo necesitamos algún mecanismo para indicar el principio y el fin de un párrafo.
<Pre>…</Pre>		El texto insertado entre las marca, será visualizado respetando el formato con el que fue escrito en el fichero fuente HTML.
<adres>….</adres>		Para indicar que un texto representa una dirección o una firma generalmente se activa en cursiva y suele estar tabulado.
<block quote> </block quote>		Se suele representar con tabulaciones a la izquierda y la derecha en cursiva en sistemas que no permiten representar en cursiva se puede emplear algún tipo de símbolo al principio de las líneas.
<br>…..</br>		Este elemento solo tiene marca inicial eh indica un salto de línea.
<hr>….</hr>		Solo tiene marca inicial y se emplea para representar una línea horizontal.
ATRIBUTOS DE LA MARCA BODY
Atributos		Función			Código HTML
BGcolor		Este atributo permite escoger un color para el fondo de la página. Donde “rr” “gg” “bb” son valores hexadecimales entre 00 y ff.			<body "BGcolors=”#rrggbb”>
Background		Este atributo especifica una imagen residente en el servidor la cual se utilizara como fondo de página.			<bodybackground=”archivo.gif”>
Text		Permite controlar el color de texto estándar es decir todo texto que no especifique un enlace.			<body text=”#rrggbb”>
Link		Color de enlace que a un no ha sido visitado.			<body link=”rrggbb”>
Alink		Color muy fugaz que aparece cuando se hace clic sobre el enlace.			<body alink”#rrggbb”>
Vlink		Es el color de un enlace que ya ha sido visitado.			<body vlink=”#rrggbb”>
LETRAS
Font	Permite actuar sobre bloques distintos de caracteres situados en la misma línea el atributo size: regula la altura de los caracteres entre el rango del 1 al 7 el atributo color: especifica el color de los caracteres.					<Font size=3color=#008000>…texto…</Font>
Estilos	Código HTML
Negrita	<B> negrita <b>hola! </b>
Cursiva	<I> cursiva <b>hola! </i>
Subrayado	<V> subrayado <b>hola! </v>
Estilos Lógicos	Marcas
Cita	<CITE>
Código fuente	<CODE>
Definido	<DFN>
Enfatiza	<EM>
Palabra clave	<KDB>
Ejemplo	<SAMP>
Resalta	<STRONG>
Variable	<VAR>
Combinación de tamaño y estilo	<i> <Font size=5> <b> hola, </b>como <font size=6> estas? </font> </font> </i>
Atributos	Función							Codigo HTML
Hiperenlace	Un ancla por lo tanto sirve para especificar la partida y la llegada de un enlace hipertexto.							<A>
HREF	Crea un enlace hacia un servidor situado en algún punto de internet o hacia algún documento propuesto por algún servidor , la marca específica , HREF el atributo cuyo valor precisa el URL del documento a recuperar . Ancla de partida hacia un enlace externo.							<A HREF=”URL_de_destino”>zona_activable</A>
Zona activable con atributos visuales	El atributo HREF ancla partida a un enlace externo. Crea un enlace a un punto determinado del fichero en ejecución. Para ello hay que colocar un ancla activa (ancla de partida). Un ancla inactiva (ancla de llegada) el ancla de partida se define de la siguiente forma .							<A HREF=#etiqueta>zona_activable_con_atributos_visuales </A>
Name	Define el ancla de llegada , lugar que se podrá acceder haciendo clic sobre un ancla de partida.							<A NAME=”Label”>zona_no_activable_sin_atributos_visuales </A>
Tabla	Regula la presentación general de la tabla mediante tres atributos: Border:Define el grosor del marco externo Cellpadding: Define el espacio alrededor del texto de una celda Cellspacing: Define el espacio entre celdas Width: Define la anchura de la tabla relativa a la ventana.							<table> y </table>
Valink (alinecaión)	Puede tomar los valores de: Top: Coloca el texto en la parte superior de la celda Bottom: Coloca el texto en la parte inferior de la celda Middle: Coloca el texto en el centro de la celda Aling(Alineación horizontal): Que puede tomar los valores: Rigth: Colocar el texto a la derecha de la celda Letf: Coloca el texto a la izquierda de la celda Center: Centra el texto en la celda							<TR> y </TR>
Marca	Función
<TD>	Es el elemento de inicio de una columna .Puede completarse con los atributos Valing y Aling que será entonces prioritarios sobre los mismos valores definidos en la marca <TR>.
<TH>	esta marca funciona de forma similar a <TD> admitiendo los mismos atributos pero se considera como una marca de título de celda automáticamente centra el texto y lo pone en negritas .
<IMG>	permite influir un imagen esta marca ira siempre complementada con el atributo <SCR> que permite dar la dirección del fichero grafico (imagen ,foto , animación)que contienen la imagen.
<SCR>	permite especificar un URL y es por tanto correcto encontrar imágenes definidas como: <IMG SCR=”http://....../rosa.gif>
Marcas	Función:							Codigo HTML:
Alineación de imágenes: <img>	admite el atributo aling que permite situar imagen en relación a la línea de texto actual y puede tomar los siguientes valores Top para alinear la parte superior de la imagen Middle: para alinear el centro de la imagen. Bottom: para alinear.							<IMG SRC=”new.gif” aling=top>
Imagenes externas:	Este tipo de imagines no aparecen en la pantalla cuando se carga la página, si no que se creó un enlace hipertexto cuyo extreme podrá ser una imagen							<A HREF=”image/new.gif”> hacer clic aquí </A>
Imágenes con Anclas:	Se puede remplazar el texto de una ancla por una marca que define una imagen. En este caso la imagen tiene un borde de color para indicar que se trata de un enlace Hipertexto, sobre el que se puede hacer un clic.							<A HREF=”image/new.gif”><imgSRC.”imagen1info.gif><A/>
Formularios:	Es una plantilla para representar un conjunto de datos y generar en la pantalla cuadros de dialogo con el lector. Como en un formulario en papel se podrán tener zonas en las que se introducirá un texto, casillas de verificación, listas de selección, etc… El usuario rellena zonas en su formulario que se identifican con un nombre simbólico. Cuando el formulario se envía al programa que lo va a tratar. Este recibe el identificador de cada zonmay el valor introducido. Es importante señalar que la utilidad de los formularios está limitada al uso de las paginas junto con sus servidores, ya que las sensaciones asociadas son programas (generalmente scripts de CGI).							<FORM> y </FORM>
Method:	Está dirigido al programador que codifica el Script al que puede darse el valor post o el valor GET.							<FORM METHOD=tipo_de método ACTION=URL_del _script>
Action:	Define el URL de un programa script encargado de tratar los datos adquiridos desde el formulario.							<FORM METHOD=tipo_de método ACTION=URL_del _script> <FORM MTHOD=”post” ACTION=”agi_bin/inscripción”
Type	Asociado a la marca input permite la selección del elemento de entrada. Puede tomar los siguientes valores. Submit: Desencadena el envio del formulario hacia el script; el texto definido en value se escribirá en el botón. Salida. -Reset: Permite borrar los datos ya entrados Borrar -Pasword: Entrar una palabra clave de forma confidencial cheatbox: Crea un bloque de botones que permiten una selección multiple de opciones Macintosh PC radio: Crea un bloque de botones que permiten una selección exclusiva entre varias opciones. hidden: Sirve para pasar datos adquiridos de un formulario a otro sin que aparezca nada en pantalla							Submit: <FORM> <INPUT TYPE =”submit” VALUE=”salida”> </FORM> Reset: <FORM> <INPUT TYPE=”reset” VALUE=”Borrar”> </FORM> Pasword: <FORM> <INPUT TYPE=”pasword” NAME=”pwd”> </FORM> Cheatbox: <FORM> <INPUT TYPE=”checkbox”=micro” VALUE=”mae”> Macintosh <INPUT TYOE=”checkbox” NAME=”micro” VALUE=”pc”> PC </FORM> Radio: · CD-ROM o Disket <FORM> <INPUT TYPE=”radio” name=”media” value=”d” checked> CD-ROM <INPUT TYPE=”radio” name=”media” value=”dk”> Disket </FORM> Hidden: <INPUT TYPE=”hidden” name=”nombre_de_variable” value=”valor_de_la_variable”>
CAMPOS DE SELECCION:
Marca	Función							Código HTML
<SELECT>	Permite generar listas de selección simple o de selección variable.							menu desplegable: <FORM> <SELECT NAME=”sede”> <OPTION> Entrada lateral <Option selected> entrada directa </SELECT> </FORM> Múltiple: Ventana con la barra de desplazamiento (opción de selección múltiple) <FORM> <SELECT MUTIPLE name=”lenguaje” siza=”3”> <Option selected> Had <Option>Ctt <Option>Clipper <Option>pascal <Option>fortran <Option>cabol </select> </FORM>
<OPTION>	Crea la lista de Items.
<SIZE>	Presenta la lista>; si su valor es inferior a 2 o esta ausente la lista de interpreta como un un menú desplegable (pop-list). En caso contrario la lista se visualizara en una ventana con barra de desplazamiento el valor dado entonces el atributo <SIZE> da entonces el número de líneas visible en la ventana .La opción de selección múltiple se deriva de la presencia del atributo múltiple.
<TEXT AREA>	Permite crear una ventana con barras de desplazamiento horizontal y vertical, en la que se podrá escribir texto. El valor dado a los atributos: ROWS<líneas> y Column <COLUMNAS> delimita el tamaño de esta ventana							<FORM> <TEXT AREA name=<”coment” rows=”5cols=40> Introduzca aqui sus comentarios </TEXT AREA> </FORM>

SUBMÓDULO III

martes, 21 de mayo de 2013

Enlace a pagina Web Galeon

martes, 16 de abril de 2013

Apuntes de Submodulo 3: Elaboracion de Paginas Web