Trabajos
TRANSCRITO DE APUNTES
DOCUMENTOS
Marcas
Las marcas delimitan el tamaño y los elementos de
un documento como cabeceras, párrafos, etc. Y son utilizados para dar un
tratamiento diferente al texto que se encuentre entre las marcas.
->HTML: las marcas
de debilitan con signos para cubrir menor que y cubrir mayor que, (abrir < inferior a y cerrar >
superior a).
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 valor ira entre comillas su
dicho valor es alfanumérico.
Estructura de los números
Cabecera: se emplea
para facilitar información acerca del documento y esté delimitada por:
<HEAD>…texto… </HEAD>. Dentro de la cabecera podemos destacar el
título que indica el nombre del documento.
Ejemplo:
<HTML>
<HEAD>
<TITLE> Bienvenido </TITLE>
<HEAD>
<TITLE> Bienvenido </TITLE>
</HEAD>
</HTML>
Cuerpo
El resto del
documento recibirá entre las marcas <BODY> y </BODY>
Ejemplo:
<HTML>
<HEAD>
<TITLE>...Bienvenida…</TITLE>
</HEAD>
<BODY>
.
.
.
</BODY>
</HTML>
Encabezado
Los encabezados se
emplean para dividir los documentos en secciones para marcar los títulos de
esas secciones. Las marcas son entre 1 y 6 donde el uno tiene mayor tamaño.
Ejemplo:
<H1> Tamaño
mayor </H1>
.
.
.
<H6> TAMAÑO
MENOR </H6>
Definición de bloques
Para definir y
separar bloques de texto se emplea una serie de marcas que definen párrafos,
texto pre formateado o bloques con significado especial como direcciones o
citas:
<P> y
</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.La marca
inicial y final son … <P> y </P>
<PRE>: el texto
insertado entre las marcas <PRE> y </PRE> será visualizado
respetando el formato con el que fue escrito en el fichero fuente HTML.
<ADDPESS>:
Empleada para aplicar que un texto representa una dirección o una firma.
Generalmente se activa en cursiva y suele estar tabulado.
<BLOCK QUOTE>:
Se suele representar con tabulaciones a la izq. y der. y 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>: Este
elemento solo tiene marca inicial e indica un salto de línea.
<HR>: Solo
tiene marca inicial y se emplea para representar una línea horizontal.
COMENTARIOS
Todo texto que
empiece por </… comentario…> será ignorado por el buscador por lo tanto
no será visible esto sirve al autor del documento para comentar en su archivo
fuente.
FONDOS Y COLORES DE TEXTO
Un cierto numero de
atributos de la marca <BODDY>, permite controlar el color de fondo de la
ventana, el color de los caracteres del texto y finalmente el color de los
enlaces: atributo <BGCOLOR>; este atributo permite escoger un color para
el formato de la pagina.
<BODY BGCOLOR=”#rrggbb”> donde:”rr””gg” y ”bb”” son valores
hexadecimales entre 00 y FF.
ATRIBUTO BACKGROUND
Este atributo
especifica una imagen recidente en el servidor la cual se utilizara como fondo
de pagina <BODY BACKGROUND=”archiv.gif”>
TEXT
Permite controlar el
color del texto estándar es decir todo texto que no especifique un enlace
<BODY TEXTO=”#rrggbb”>
LINK
Color de enlace que
aun no ha sido visitado <BODY
LINK=”#rrbbgg”>
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”>
LETRA
Es la marca que
asigna el tamaño de los caracteres, donde “n” varía del 1 a 6. Los más grandes tiene
valor uno y los más pequeños valor 6. El texto entre estas marcas se trata en
negrita <Hn>
TAMAÑO DE LETRA Y COLOR
La marca FONT permita
actuar sobre bloques distintos de caracteres situados en la misma línea. El
atributo SIZE: regula la altura de los caracteres entre el rango de (1 - 7).
El atributo COLOR:
especifica el color de los caracteres. Ejemplo. <FONT
SIZE=3COLOR=#008000>…TEXTO…</FONT>
ESTILO FISICO O ESTILO DE CARACTERES
<B>Negrita <b>hola!</b> hola!
<I>Cursiva <i>hola!</i> hola!
<V>Subrayado <v>hola!</v> hola!
Estilos lógicos,
estilo de párrafo
<CITE> Cita
<CODE> Codigo
fuente
<DFN> Definido
<EM> Enfatiza
<KDB> Palabra
clave
<SAMP> Ejemplo
<STRONG>
Resalta
<VAR> Variable
Combinacion de tamaño
y estilo
La ventana trabaja
bajo el efecto de solo un parcerrado de marcas ejemplo:
<i>
<font size=5>
<b> Hola, </b> como
<Font size=6> estas? </font>
</font>
</i>
HIPERENLACE
El
lector explira un docuento en el WEB
haciendo clic sobre las zonas activas para asi hacer aparecer nuevos
documentos. El <HTMLL> 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 visuallizado cuando se haga clic sobre
esta zona. Un ancla por loo 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 hacia un documento propuesto por dicho servidor. La marca
especifica el atributo HREF cuyo valor precisa URL del documento a recuperar:
<AHREF=”URL_D_DESTINO”> zona_activable </A>
1.El atributo HREI,
ancla de partida a un enlace interno; crea a un enlace a un punto determinado
del fichero en ejecucion. Para ello hay que colocar un ancla activa (ancla de
partida) y un ancla de inactiva (ancla de llegada). El ancla de partida se define de la siguiente forma:
3 una activable con
atributos visibles <AHAREF=#etiqueta>
zona_activable_con_atributo_visuales </A>.
2. El atributo NAME,
ancla de llegada define el ancla de llegada, lugar que se podrá acceder
haciendo clic sobre un ancla de partida.
3 una no activable
sin atributos visuales:
<ANAME=”Label”>
zona_no_activable_sin_atributos_visuales </A>
…………………………………………………………………………………………………………………………………….
TABLA
Una tabla se define
entre las marcas entre <TABLE> y </TABLE>. Esta primer amarca
regula a presentación general de la tabla mediante tres atributos:
*BORDER: define el
grosor del marco exterior.
*CELPADDING: define
el espacio alrededor del texto de una celda.
*CELLPACING: define
el espacio entre celdas.
*WIDTH: define la
anchura de la tabla relativa a la ventana.
MARCAS
Las marcas que
definen una nueva fila son:
<TR> y
</TR> que admiten los siguientes atributos de alineación del texto en el
interior de todas las celdas de la fila:
*VALIGN (alineación
vertical): que puede tomar los valores.
-TOP: coloca el texto en la parte
superior de la celda.
-BOTTOM: colca el texto en la parte
inferior de la celda.
-MIDDLE: coloca ell texto en el centro
de la celda.
*ALIGN (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: centra el texto en la celda.
La marca <TD>
es el elementyo del inicio de una columna. Puede completarse con los atributos
<VALIGN> y <ALIGN> que será entonces prioritarios sobre los mismos
valores definidos en la marca <TR>.
La marca <TH>
esta marca funciona de forma similar a <TD> admitieno los mismos
atributos pero se considera como una marca de titulo de celda.
Atomaticamente centra el texto y lo pone
en negrita.
La marca <IMG>
permite incluir una imagen. Esta marca ira siempre complementada con el
atributo <SCR> que permite dar la
dirección del fichero grafico (imagen, foto, animacion) que contiene la imagen.
El valor del atributo
<SCR> permite especificar un URL y es por tanto correcto encontra
imágenes definidas como sigue.
<IMG SCR:”http//img/rosa.gif”>
ALINEACION DE IMAGENES
La marca <IMG>
admite el atributo ALIGN que permite situar la imagen en relacion a la linea de
texto actual y permite tomar los siguientes valores.
*TOP: para alinear la
parte superior de la imagen.
*MIDDLE: para alinear
el centro de la imagen.
*BOTTM: para alinear
la base de la imagen.
Ejemplo:
<IMG SRC=”new.gif” align=top>
IMAGENES EXTERNAS
Este tipo de imagines
no aparecen en la pantalla cuando se carga la pagina, si no se crea un enlace hipertexto cuyo extremo podrá ser
una imagen.
Ejemplo:
<A
HREF=”imagen/new.gif”> hacer clic aqui </A>
IMAGENES COMO ANCLAS
Se pueden reemplazar
el texto de una ancla por 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:
<A
HREF=”image/new.gif”><IMG SRC=”image/info.gif”></A>
FORMULARIOS
Un
formulario es una pantalla para representar un conjunto de datos y generar en
la pantalla cuadros de dialogo con el lector. Como un formulario en papel, se
podrán tener zonas en las que se introducirá, casillas de verificación, listas
de seleccion, etc.
El ususario rellenara zonas en su formulario
que se identifican con un nombre simbolico. Cuando el formulario se envía al programa que lo va a tratar, este recibe
identificador de cada zona y es el valor introducido.
Es importante señalar que la utilidad de los
formularios esta limitada al uso de las paginas junto con sus servidores, ya
que las acciones asociadas son programas (generalmente scripts de CGI) estos
programas deben funcionar en un servidor al que se le proporcioan los datos de
un formulario para ser procesados.
DECLARACION DEL FORMULARIO
La marca
<FORM> y </FORM> define un formulario y entre ellos se situara
todas las marcas que genera los diversos elementos que componen un formulario.
Esta maraca debe de ir acompñada obligatoriamente por dos …..
1.El
atributo METHOD esta dirigido al programador codifica el script. Al que pueden
darse el valor POST o GET que define en le modo de transferencia de los datos
hacia el script.
2. El
atributo ACTION que define el URL de un programa (script) encargado de tratar
los datos adquiridos desde el formulario.
MARCAS
Todas
las marcas que se definirán tienen los siguientes atributos comunes :
1.El
atributo “NAME” define el nombre que permitirá al script identificar el origen
de los datos. Este nombre de ser único NAME=nombre_d_la_variable_asociado.
2.El
atributo “VALUE” definido pára un campo de 2 puntos de un texto; permite
definir el contenido del campo.
3.El
botón “SUBMINT” indica el texto a escribir en el botón.
4.El
botón “RADIO” y “CHECXBOX”: 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 encontrar un texto y botones que
permiten escoger opciones.
El
atributo “TYPE” asociado a la marca <INPUT> permite la selección del
elemnto de entrada. Puede tomar los siguientes valores:
*SUBMINT:de
ser cadena el envío del formulario hacia el script; el texto definido en
“VALUE” se escribirá en el botón:
Ejemplo:
salida
<form>
<input type=”submint
value”=”salida”>
</form>
*RESET: permite borrar los datos ya
entrados.
Ejemplo:
Borrar
<form>
<input type=”reset”value=”borrar”>
*PASSWORD:
permite entrar un palabra de forma clave confidencial.
Ejemplo:
Contraseña
<form>
<input type=”password” name=”pwd”>
</form>
*CHECXBOX: cea un bloque de botones que
permiten una seleccion multiple de opciones.
Ejemplo:
<form>
<input
type=”checxbox” name=”micro” value=”mac”> Macintosh
< <input type=”checxbox”
name=”micro” value=”pc”> PC
</form>
*RADIO: crea un bloque de botones que
permiten una selección exclusiva entre varias opciones.
Ejemplo:
<from>
<input type=”radio” name=”media”
value=”cd” checked> CD-ROM
<input type=”radio” name=”media”
value=”disquete” checked> DISQUETE
*HIDDEN:
sirve para pasar datos adquiridos de un formularios a otro sin que aparezca
nada en pantalla.
Ejemplo:
<input type=”hidden”
name=”nombre_de_variable” value=”valor_de_la_variable”>
CAMPOS DE SELECCIÓN
La marca
<SLECT> permite genera listas de selección simple o de selección
variable. Seprograma con una lista en la que los ítems se especifica mediante la marca <OPTION>. La
presentación de la lista depende del atributo <SIZE>; si su valor es
inferior a dos o esta ausente la lista se interpreta como u menu despegable
(pop-list), en caso contrario la lista se visulizara en una ventana con barra
de desplazamiento. El valor dado entonces al atributo <SIZE> dan entonces el numero de líneas visibles en
la ventana. La opción de selección multiple se deriva de la presencia del
atributo MULTIPLE.
Ejemplo:
“MENÚ DESPEGABLE”
<form>
<select Name:”sede”>
<option> entrada indirecta
<option> entrada lateral
<option SELECTED> entrada directa
</selct>
</form>
“VENTANA
CON BARRA DE DESPLAZAMIENTO”
<form>
<select MULTIPLE
NAME=”leunguaje” SIZE=”3”>
<option SELECTED> Ada
<option>C++
<option>Clipper
<option>
<option>
<option>
</select>
</form>
AREA DE TEXTO
La marca
<TEXTAREA> permite crear una venta con barras de desplazamiento
horizontales y verticales en la que se podrá escribir texto. El valor dado a
los atributos Rows (lineas) y Cols (columnas) delimita el tamaño de esta
ventana.
Ejemplo:
<form>
<textarea
names=”comment” rows=5 cols=40>
Intoduzca
aqui sus comentarios
</textarea>
</form>
No hay comentarios:
Publicar un comentario