DOCUMENTOS
Las
marcas delimitan el tamaño y los elementos de un documento;
Como: cabeceras, párrafos, etc. Son utilizados para dar un elemento
diferente al texto que se encuentra entre las marcas. En HTML las marcas
se delimitan con signos para abrir (<) y cerrar (>)
Como: cabeceras, párrafos, etc. Son utilizados para dar un elemento
diferente al texto que se encuentra entre las marcas. En HTML las marcas
se delimitan con signos para abrir (<) y cerrar (>)
ATRIBUTOS
DE LAS MARCAS
Algunas marcas pueden admitir atributos pudiendo tener cada uno de
estos atributos un valor como por ejemplo: ancho,alto,color,formato,
estilo.
Este valoraría entre comillas si dicho valor es alfanumérico.
Algunas marcas pueden admitir atributos pudiendo tener cada uno de
estos atributos un valor como por ejemplo: ancho,alto,color,formato,
estilo.
Este valoraría entre comillas si dicho valor es alfanumérico.
Marcas ESTRUCTURA DE LOS DUCUMENTOS
CABEZERA
La cabecera se emplea para facilitar información acerca del documento
y está delimitada por < HEAD…T EXTO…</HEAD>
dentro de la cabecera podemos destacar el título que indique el nombre
del documento: explorador de internet
buscador “ejemplo o página
Código fuente
<HTML ><HEAD><TITLE><BIENBENIDA </TITLE>
CABEZERA
La cabecera se emplea para facilitar información acerca del documento
y está delimitada por < HEAD…T EXTO…</HEAD>
dentro de la cabecera podemos destacar el título que indique el nombre
del documento: explorador de internet
buscador “ejemplo o página
Código fuente
<HTML ><HEAD><TITLE><BIENBENIDA </TITLE>
</HEAD>
CUERPO.
el resto del documento residirá entre las marcas:
<BODY></BODY>
<HTML>
<HEAD>
<TITLE> BIENVENIDA… </TITLE>
<HEAD>
<BODY>
…
…
<BODY>
<HTML>
ENCABEZADO
Los encabezados se emplean para dividir los documentos en
secciones completamente para marcar los títulos de esas secciones. Las marcas
son entre una y seis donde el 1 tiene mayor tamaño.
<H!> tamaño mayor</H1>
<H6> tamaño menor </H6>
<H6> tamaño menor </H6>
Definición de bloques
Para definir y separar bloque de texto se emplea una
serie de marcas que definen párrafos, texto preformatedo o bloque con
significado especial como direcciones o citas
<P>. se utilizan para separar párrafos dado que
para el HTML todo el texto es continuo necesitamos algún mecnismo para indicar
el inicio y el fin de un parrfon la marca inicial y final son: <P> y
<P><PRE>
El texto inseratdo entre las marcas <PRE> y
</PRE> será visualizado respetando el formato en el que fue escrito HTML.
Empleo para indicar que
un texto representa una dirección o una firma, se
activa en cursiva y suele estar tabula.
<BLOCK QUOTE>
se suele representar con tabulaciones la izquierda y derecha en cursivas en
sistemas que no permiten representar en cursiva se puede emplear algún tipo
de símbolo en las líneas.
<BR>
Este solo tiene mar inicial e indica un salto
<HR>
solo tiene marca inicial y se emplea para representar una línea horizontal.
MARCAS COMENTARIOS:
Todo texto que empiece por <!...COMENTARIO> será ignorado por
buscador por lo tanto no será visible esto sirve al auntor del documento para
comentar en su archivo fuente
FONDOS, COLORES DE TEXTO
un cierto número de atributos de la marca BODY permiten controlar el color
del fondo de la ventana, el color de los caracteres de texto y finalmente el
color de los enlaces:
atributo BGCOLOR: este atributo permite escoger un color para el fondo de la
pagina<BODY BGCOLORS =#”brggbb”>
activa en cursiva y suele estar tabula.
<BLOCK QUOTE>
se suele representar con tabulaciones la izquierda y derecha en cursivas en
sistemas que no permiten representar en cursiva se puede emplear algún tipo
de símbolo en las líneas.
<BR>
Este solo tiene mar inicial e indica un salto
<HR>
solo tiene marca inicial y se emplea para representar una línea horizontal.
MARCAS COMENTARIOS:
Todo texto que empiece por <!...COMENTARIO> será ignorado por
buscador por lo tanto no será visible esto sirve al auntor del documento para
comentar en su archivo fuente
FONDOS, COLORES DE TEXTO
un cierto número de atributos de la marca BODY permiten controlar el color
del fondo de la ventana, el color de los caracteres de texto y finalmente el
color de los enlaces:
atributo BGCOLOR: este atributo permite escoger un color para el fondo de la
pagina<BODY BGCOLORS =#”brggbb”>
ATRIBUTO BACKGROUND
Este atributo especifica una imagen
recidente en el servidor la cual se utilizara como fondo de página
<BODY,BACKGROUND= “archivo.gif”>
ATRIBUTO TEXT
Permite controlar el color del texto
estándar es decir todo texto que no especifique un enlace
<BODY TEX=#”rrggbb”>
<BODY TEX=#”rrggbb”>
ATRIBUTO LINK
Color de enlace que aún no ha sido
visitado
<BODY LINK=#”rrggbb”>
<BODY LINK=#”rrggbb”>
ATRIBUTO ALINK
color muy fugas que aparece cuando se hace clic sobre el enlace
ULINK es el color de un enlace que ya ha sido visitado
color muy fugas que aparece cuando se hace clic sobre el enlace
ULINK es el color de un enlace que ya ha sido visitado
Es la marca que asigna el
tamaño de los caracteres “n” y varia de 1 a 6
las más grandes tienen valor 1 y las más pequeñas valor de 6, el texto entre
estas marcas se trata de negrita <Hn>
TAMAÑO DE LA LETRA Y COLOR
la marca FONT permite actuar sobre bloques distintos de caracteres situados
en la misma línea
ATRIBUTO SIZE
regula la altura de los caracteres (1-7) en atributo COLOR especifica el color de los
caracteres
EJEMPLO: <FONT SIZE 3 color=#008000>…TEXTO…</FONT>
COMBINACION DE TAMAÑO Y ESTILO
la ventana trabja bajo el efecto de solo un par cerrado de marcas ejemplo:
<i>
<FONT SIZE =5>
<B> hola, </B> como
<FONT SIZE =6> estas? </FONT>
</FONT>
</i>
las más grandes tienen valor 1 y las más pequeñas valor de 6, el texto entre
estas marcas se trata de negrita <Hn>
TAMAÑO DE LA LETRA Y COLOR
la marca FONT permite actuar sobre bloques distintos de caracteres situados
en la misma línea
ATRIBUTO SIZE
regula la altura de los caracteres (1-7) en atributo COLOR especifica el color de los
caracteres
EJEMPLO: <FONT SIZE 3 color=#008000>…TEXTO…</FONT>
COMBINACION DE TAMAÑO Y ESTILO
la ventana trabja bajo el efecto de solo un par cerrado de marcas ejemplo:
<i>
<FONT SIZE =5>
<B> hola, </B> como
<FONT SIZE =6> estas? </FONT>
</FONT>
</i>
LETRAS
ESTILO FISICO O ESTILO DE CARACTERES
}
|
<B>NEGRITA
|
<b>Hola!
|
</b>
|
|
<I>
Cursiva
|
<I>hola!
|
<I>
|
|
<√>
Subrayado
|
<√>hola
|
<√>
|
ESTILOS
LOGICOS ESTILOS DE PARRAFO
|
<CITE>
|
Cita
|
|
|
<CODE>
|
Código
fuente
|
|
|
<DFA>
|
Definido
|
|
|
<EM>
|
Enfatiza
|
|
|
<KDB>
|
Palabra
clave
|
|
|
<SAMP>
|
Ejemplo
|
|
|
<STRONG>
|
Luz
|
|
|
<UAR>
|
variable
|
|
HIPERENLACE
El lector explora un documento en la
web haciendo clic sobre las zonas activas para asi aparecer nuevos documentos
en HTML definimos una zona activa ( que puede ser un texto o una imagen) que se
asocia al URL(protocolo de direccionamiento del documento) que sustituirá al
documento visualizado cuando se haga clic un ancla sirve para especificar la
partida y la llegada de un enlace hipertexto <A>
EL ATRIBUTO HREF
Ancla de partida hacia un enlace
externo crea un enlace hacia un servidor situado en algún punto de internet o
hacia un documento propuesto por dicho servidor, la marca cuyo valor precisa
URL zona activable.
<A HREF = “URL_de_destino”>zona_activable</A>
<A HREF = “URL_de_destino”>zona_activable</A>
El atributo HREF ancla de partida a un enlace interno crea un enlacea un punto determinado del fichero en ejecución. Para ello hay que colocar un ancla activa (anclar de partida) y un ancla de partida (ancla de llegada) se define asi:
zona activable con atributos visuales
<A HREF=#etiqueta>zona_activable_con_atributos_visuales_</A>
el atributo de NAME ancla de llegada. Define el ancla de llegada lugar que se podrá acceder haciendo el clic sobre un ancla de partida
Zona no activable sin atributos
visuales <A NAME = “LABEL”>zona_no_activable_sin_atributos_visuales</A>
Una tabla se define entre las marcas
<TABLE> y </TABLE> , esta primera marca regula la presentación general de la tabla
mediante tres atributos: Bordear define el grosor del marco exterior
CelLPADDINA: define el espacio alrededor del texto de una celda CELLSPACING: define el espacio entre celdas
WIDTCH: define la anchura de la tabla relativa a la ventana.
Las marcas que definen una nueva
fila son:
<TR> y </TR> que admite los siguientes atributos de alineación de texto en el interior de todas las celdas de la fila:
<TR> y </TR> que admite los siguientes atributos de alineación de texto en el interior de todas las celdas de la fila:
VALING(alineación) que puede tomar
los valores
TOP: coloca el texto en la parte superior de la celda
BOTTOM:
TOP: coloca el texto en la parte superior de la celda
BOTTOM:
MIDDLE: coloca el texto en el centro
de la celda
ALINGN:
(alineación Horizontal) que puede tomar los valores:
RIGHT- Coloca el texto a la derecha de la celda.
LEFT-Coloca el texto a la izquierda de la celda.
CENTER- sentra el texto en la celda
RIGHT- Coloca el texto a la derecha de la celda.
LEFT-Coloca el texto a la izquierda de la celda.
CENTER- sentra el texto en la celda
<TD> es el elemento de inicio
de una columna. Puede completarse con los atributos VALING y ALING que serán 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 titulo de celda. Automáticamente centra el texto y lo pone en
negrita
<IMG> permita incluir una
imagen. Esta marcara siempre complementada con el atributo
<SCR> que permite dar dirección del fichero grafico (imagen, foto animación que contiene la imagen)
<SCR> que permite dar dirección del fichero grafico (imagen, foto animación que contiene la imagen)
El valor del atributo SCR permite
especificar un URL y es por lo tanto un correcto encontrar imágenes definidas
compsing
ALINEACION DE IMÁGENES
La marca IMG
admite el atributo ALING que permite situar la imagen en relación a los siguientes:
TOP para realizar la parte superior de la imagen
MIDDLE para alinear el centro de la imagen
BOTTOM para alinear la base de la imagen
<IMG SPC=”new.GIF” aling=lops
TOP para realizar la parte superior de la imagen
MIDDLE para alinear el centro de la imagen
BOTTOM para alinear la base de la imagen
<IMG SPC=”new.GIF” aling=lops
Este tipo de
imágenes no aparece en la pantalla se crea un enlace hipertexto cuyo extremo
podrá se una imagen ejemplo
< A HREF =”image/new.gif”> hacer clic aquí </A>
< A HREF =”image/new.gif”> hacer clic aquí </A>
IMÁGENES CON
ANCLAS
Se puede
reemplazar 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, ejemplo:
FORMULARIOS
Un
formulario es una plantilla para representar un conjunto de datos y generar en
la pantalla cuadros de dialogo con el lector como en una formulario en papel se
podrá tener zonas en donde se incluirá
un texto, casilla vista de selección etc. El usuario rellenara zonas en nombre
simbolico. Cuando el formulario se envía al programa que va que al tratar este
recibe el identificador de cada zona y el valor introducido.
Es importante
señalar que en la utilidad de los formularios esta limitada al uso de los pagos
y junto con sus sevidores ya que las acciones asociadas son programas
generalmente scripts de GCI.
Estos programas deben funconar en un servidor al que proporcionan los datos de un formulario para ser procesados
Estos programas deben funconar en un servidor al que proporcionan los datos de un formulario para ser procesados
DECLARACION
DEL FORMULARIO
La marca define un formulario y entre ellas se situaran todas las marcas que generan los diversos elementos que componen un formulario esta marca debe de ir ligadas por dos atributos.
El atributo methodesta dirigido al programador que codifica el script al que puede darse el valor posto el valor cet que define el modo de tranferencia de los datos hacia el script
El atributo action que define el URL de un programa script encargado de tratar los datos adquiridos desde el formulario
La marca define un formulario y entre ellas se situaran todas las marcas que generan los diversos elementos que componen un formulario esta marca debe de ir ligadas por dos atributos.
El atributo methodesta dirigido al programador que codifica el script al que puede darse el valor posto el valor cet que define el modo de tranferencia de los datos hacia el script
El atributo action que define el URL de un programa script encargado de tratar los datos adquiridos desde el formulario
<FROM
METHO O=tipo_de_metodoAction=URL_del_script>
<FORM METHO=”post” Action=”cgi_bin/inscripcion”>
<FORM METHO=”post” Action=”cgi_bin/inscripcion”>
Todas las
marcas que se definiran tienen los siguientes atributos communes, el atributo
de name define el nombre que permitira al script identifica el origen de los
datos. Este nombre debe ser única NAME= nombre_de_la_variable_asociada
El atributo VALUE definido para un campo de: texto
permite definir el contenido del campo el botón submint: indica el texto a escribir el botón
El atributo VALUE definido para un campo de: texto
permite definir el contenido del campo el botón submint: indica el texto a escribir el botón
Boton radio, botón checxbox:
valor asociado al botón cuando esta pulsado
NAME identifica el bloque de botones
valor asociado al botón cuando esta pulsado
NAME identifica el bloque de botones
Campos de
entrada
La marca <INPUT> servirá para definir campos para entrar un texto y botones que permiten escoger opciones el atributo TYPE asociado a la marca <INPUT> permite la selección del elemento de entrada puede tomar los siguientes valores
La marca <INPUT> servirá para definir campos para entrar un texto y botones que permiten escoger opciones el atributo TYPE asociado a la marca <INPUT> permite la selección del elemento de entrada puede tomar los siguientes valores
SUBMIT:
desencadena en uno de los formularios hacia el script, el texto definido en
volue se escribirá en el botón
salida
<form>
<input tape=”submit” value=”salida”>
<input tape=”submit” value=”salida”>
No hay comentarios:
Publicar un comentario