DOCUMENTOS
MARCAS
las marcas delimitan elementos de un documento como cabeceras
parrafosetc, y son utilizados par dar un tratamiento diferente al texto que se
encuentre entre las marcas.
En HTML las marcas se delimitan con los signos > y < es
decir para abrir utilizamos menor que para cerrar mayor que, adicionando la
diagonal inversa al cerrar.
ATRIBUTO DE LAS MARCAS
algunas marcas pueden admitir atributos pudiendo tener cada
uno de estos atributos con valor. como por ejemplo: olor, textura, estilo,
formato, ancho, bajo. Este valor ira entre comillas si dicho valor es alfa
numerico.
ESTRUCTURA DE LOS DOCUMENTOS
CABECERA
lacabecra se emplea para facilitar informacion acerca del
documento y esta delimitada por <HEAD> Y </HEAD>.
Dentro de la cabeza podemos destacar el titulo que indica el
nombre del documento esta delimitado por <TITLE> Y </TITLE>.
<HTML> EXPLORADOR
DE INTERNET
<HEAD> BROWSER
O NAVEGADOR
<TITLE>BIENVENIDIO</TITLE> CODIGO FUENTE CTRL+U
</HEAD>
<BODY>
</BODY>
</HTML>
CUERPO
El resto del documento recibiraentree las marcas <BODY>
Y </BODY>
ENCABEZADO
Los encabezados se emplean para dividir los documentos en
secciones o mas concretamente para marcar los titulos de las secciones. Las
marcas son del tipo:
<H1> tamaño mayor </H1>
<H6> tamaño menor</H1>
DEFINICION DE BLOQUES
para definir y separar bloques de texto se emplean una serie
de marcas que defieneparrafos, texto preformateado o bloques con significado
especial como direcciones o citas
<P>
se utiliza para separaparrafos. Dado que para HTML tod el
texto es continuo, necesitamos algun mecanismo para indicar el principio y el
fin de un parrafo. las marcas inicial y final son <P> y </P>
<PRE>
el texto insertado entre las marcas <PRE> y </PRE>sera visualizado representando
el formato con el que fue escrito en el fichero fuente HTML.
<ADDRESS>
Empleada para indcar que un texto representan una direccion o
firma gneralmente activa en cursiva y suele estar tabulado.
<BLOCKQUOTES>
Se auele representar con tabulaciones a la izquierda y derecha
y en cursiva. En sistemas que no permiten representar en cursiva se puede
emplear algun tipo de simbolo al principio de las lineas.
<BR>
este elemento solo tine marca inicial e indica un salto de
linea es decir un salto de renglon.
<HR>
Solo tiene marca inicial y se emplea para representar una
linea horizontal
COMENTARIOS
Todo texto que empiece por <!...comentario...>seraigniorado por el browser y por lo tanto no
sera visible. Esto sirve al autor del documento para comentar en su fichero
fuente
FONDOS Y COLORES DE TEXTO
Un cierto número de atributos de la marca body permite
controlar el color de fondo de la ventana, el color de los caracteres del texto
y finalmente el color de los enlaces:
<BODY atributo1 atributo2….atributo
N>
El atributo BG COLOR permite escoger un color para el fondo de
la pagina
<BG COLOR= “rrggbb”>
Donde
“rr”, “gg”, “bb”
Son valores hexadecimales
El atributo BACK GROUND (fondo) especifica una imagen
residente en el servidor la cual se utilizara como fondo de pagina.
<BODY BACK
GROUND “fichero gráfico .gif”>
El atributo TEXT permite controlar el color del texto estándar
es decir todo texto que no especifique un enlace. Ejemplo:
<BODY TEXT=” #rrggbb”>
El atributo link color
de enlace que aún no ha sido visitado
<BODY LINK=” #rrggbb”>
El atributo A link color muy fugaz que aparecen cuando se hace
clic sobre el enlace. Ejemplo:
<BODY A LINK=” #rrggbb”>
El atributo V
link es el color de un enlace que ya ha sido visitado. Ejemplo:
<BODY V LINK=” rrggbb”>
LETRA
TITULO <HN>es la marca que asigna el tamaño de los
caracteres donde “N” varia de 1 a 6.los mas grandes tienen valor de 1 y los mas
pequeños valor de 6. El texto entre las marcas se traza en negrita.
TAMAÑO DE LETRA Y
DE COLOR
<FONT>
La marca FONT permite actuar sobre bloques distintos de
caracteres situados en la misma línea
SIZE
Regula la altura de los caracteres (1 a 7)
COLOR
Especifica el color de los caracteres
< Font
size= 3 color = #00800>…texto</ Font>
ESTILO
FÍSICO O ESTILO DE LOS CARACTERES
<B> negrita <3>
hola!</B>HOLA
<I> cursiva <I>
hola!</I>HOLA
<V> subrayado <V>
hola!</V>HOLA
ESTILO
FÍSICO O ESTILO DE LOS CARACTERES
<CITE> cita
<CODE> código fuente.
<DFA> definido
<EN> enfática
<KOB> palabra clave
<SAMP> ejemplo
<STRONG> resalta
<VAR> variable
COMBINACIÓN
DE TAMAÑO Y ESTILO
Toda ventaba trabaja bajo el efecto de
solo un par cerrado de marcas. Ejemplo:
<i>
<Font size= 5>
<b> hola, </b> como
<Font size= 6> como
estas?</Font>
</Font>
</i>
HIPERENLACES
El lector explora un documento en la
web haciendo clic sobre las zonas activas para así hacer aparecer nuevos
documentos. En HTML definimos una zona activa(qu puede ser un texto o una
imagen), que se asocia al URL( protocolo de direccionamiento de documentos),
del documento que sustituirá al
documento visualizado cuando se haga clic sobre esa zona. Un ancla, por lo tanto
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 especifica el atributo HREF cuyo valor precisa el URL del
documento a recuperar
ZONA VARIABLE
<A HREF=” URL_de_destino”> zona_activable
</A>
LA
MARCA TH
Cambios de selección
La marca <select permite generar lista de selección
simple o de selección variable, se programa con una lista en la que los ítems
se especifican mediante la marca <option
.la presentación de la lista depende del atributo size si su valor es
inferior a 2 o esta sustente la lista se interpreta como un menú desplegable
(pop-list). En este caso la lista se visualiza en una ventana de barra de
desplazamiento. El valor dado entonces al atributo size da entonces el número
de líneas en la ventana. La opción de selección múltiple se deriva de la
presencia del atributo MULTIPLE.
MENU DESPLEGABLE :
<form>
<selectname =”sede”>
<option> entrada indirecta
<option> entrada lateral
<option SELECTED> entrada directa
</select>
</form>
VENTANA CON BARRA DE DESPLAZAMIENTO
<form>
<select MULTIPLE
NAME=”lenguaje” size=”3”>
<option
SELECTED> Ada
<option> c ++
<option>clipper
<option>pascal
<option>fortran
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
de papel, se podrá tener zonas en las que se introducirá un texto, casillas de
verificación listas de selección etc.
El usuario rellenara zonas en su formulario se envía al
programa que lo va a tratar, este recibe el identificador cada zona y el valor
introducido. Es importante señalar que la utilidad de los formularios esta
limitada al uso de las paginas junto con servidores ya que las acciones
asociadas son programas (generalmente scrips de CGI)
Estos programas deben funcionar en un servidor al que se
le proporcionan los datos de un formulario para ser procesados.
DECLARACION DEL FORMULARIO
La marca <form> y </form>definen un
formulario y entre ellas se situaran todas las marcas que generan los diversos
elementos que componen un formulario. Esta marca debe ir acompañada
obligatoriamente por 2 atributos:
METHOD
esta dirigido al programadorque codifica el scrip encargado de dar valor al
post o al valor GET que define el modo de transferencia de los datos hacia el
scrip.
ACTION
que define el URL de un programa script encargado de tratar los datos
adquiridos desde el formulario
<FORM METHOD=
tipó_de_metodo ACTION=URL_del_script>
<FORM METHOD=”
post” ACTION=”cgi_bin/inscription>
Todas las marcas que se definirán tienes los sgt
atribuidos comunes :
*NAME define el nombre que permitirán al scrip
identificar el origen de los datos. Este nombre debe ser único
*VALUE definido para un campo de:
TEXTO: permite definir el contenido del campo.
BOTN SUBMINT: indica el texto a escribir en el botón
BOTON RADIO Y BOTON CHEKBOX: valor asociado al botón
cuando esta pulsado. Identificar el bloque de botones.
ÁREA DE TEXTO
La marca <TEXTAREA>perimite crear una ventana con
barras de desplazamiento horizontales y verticales en la que se podrá escribir
texto. El valor dado a los atributos Rows (líneas) , COLS (columnas) delimita
el tamaño de esta ventana, ejemplo:
<form>
<textareaname
=”comment” rows=5 cols=40>
Introduzca aquí sus comentarios
</textarea>
</form>
No hay comentarios:
Publicar un comentario