Download - Ficha de codigos HTML
Diseño de Páginas Web con HTML
Primeros pasos
<HTML>
<HEAD>
<TITLE> TITULO </TITLE>
</HEAD>
<BODY>
CUERPO DEL DOCUMENTO HTML
</BODY>
</HTML>
Colores de fondo de la página <BODY BGCOLOR="#CCFFCC">
Imágenes <BODY BACKGROUND="tortuga1.gif">
Formato de fuentes Negrita <B>letra negrita</B> letra negrita
Cursiva <I>letra cursiva</I> letra cursiva
Subrayado <U>letra subrayada</U> letra subrayada
Espaciado uniforme <TT>letra con espacio uniforme</TT> letra con espacio uniforme
sentencias combinadas <B>letra negrita</B> <I>letra cursiva</I> <U>letra subrayada</U>
sentencias anidadas <B><I>letra negrita cursiva</I></B>
<I><U>letra cursiva subrayada</U></I>
<B><I><U>letra negrita cursiva subrayada</I></B></U>
Tamaño de la fuente <FONT SIZE="7">
Tipos de fuentes. <FONT FACE="ARIAL”>
Fuentes Habituales Andale Mono Arial Arial Black Comic Sans MS Courier New
Georgia Impact Times New Roman Trebuchet MS Verdana
Color de la fuente <FONT COLOR="#FF0000">
Paleta de 216 colores: números
FFFFFF FFFFCC FFFF99 FFFF66 FFFF33 FFFF00 CCFFFF CCFFCC
CCFF99 CCFF66 CCFF33 CCFF00 99FFFF 99FFCC 99FF99 66FFFF
99FF66 99FF33 66FFCC FFCCFF 99FF00 33FFFF FFCCCC 33FFCC
00FFFF 66FF99 FFCC99 66FF66 66FF33 00FFCC 66FF00 33FF99
FFCC66 FFCC33 CCCCFF 33FF66 33FF33 00FF99 FFCC00 33FF00
00FF66 00FF33 00FF00 CCCCCC CCCC99 99CCFF CCCC66 CCCC00
CCCC33 99CCCC FF99FF 99CC99 66CCFF FF99CC 99CC66 66CCCC
99CC33 00CCFF 33CCFF 99CC00 FF9999 66CC99 FF9966 66CC66
33CCCC CC99FF 00CCCC FF9933 FF9900 66CC33 66CC00 33CC99
00CC99 CC99CC 33CC66 00CC66 CC9999 FF66FF 33CC33 33CC00
CC9966 00CC33 9999FF 00CC00 CC9933 CC9900 FF66CC 9999CC
FF6699 999999 6699FF FF6666 CC66FF 999966 6699CC 999933
FF6633 FF6600 FF33FF 3399FF 999900 669999 CC66CC 0099FF
FF33CC 3399CC CC6699 669966 FF00FF 339999 669933 669900
FF3399 0099CC 9966FF CC6666 009999 CC6633 CC6600 339966
FF00CC FF3366 009966 CC33FF FF3333 339933 009933 9966CC
FF3300 FF0099 339900 009900 6666FF CC33CC FF0066 996699
FF0033 FF0000 CC00FF CC3399 996666 6666CC 996633 996600
3366FF CC3366 CC00CC 9933FF 0066FF 666699 CC3333 CC3300
3366CC CC0099 9933CC 666666 666633 0066CC 9900FF 666600
CC0066 336699 993399 CC0033 6633FF 336666 006699 CC0000
993366 9900CC 336633 006666 336600 6633CC 3333FF 006633
993333 993300 6600FF 990099 006600 0033FF 663399 990066
3333CC 663366 6600CC 990033 0033CC 990000 3300FF 663333
663300# 660099 0000FF 333399 3300CC 003399 333300 660066
333333 003366 0000CC 660033 333300 660000 330099 003333
003300 000099 330066 330033 000066 330000 000033 000000
Paleta de 140 colores: nombres
White Snow Seashell FloralWhite OldLace
Linen GhostWhite WhiteSmoke Gainsboro LightGrey
Silver DarkGray LightCyan Azure AliceBlue
Lavender LavenderBlush MistyRose MintCream Honeydew
Beige Cornsilk AntiqueWhite PapayaWhip Ivory
LightYellow LightGoldenrodYellow LemonChiffon PaleGoldenrod Khaki
BlanchedAlmond Bisque Moccasin Wheat NavajoWhite
PeachPuff LightSteelBlue LightBlue SkyBlue LightSkyBlue
DeepSkyBlue DodgerBlue CornflowerBlue SteelBlue RoyalBlue
Blue MediumBlue DarkBlue MediumSlateBlue SlateBlue
DarkSlateBlue Indigo Navy MidnightBlue MediumPurple
BlueViolet DarkViolet DarkOrchid DarkMagenta Purple
Thistle Plum Magenta Violet Orchid
MediumOrchid Pink LightPink HotPink DeepPink
PaleVioletRed MediumVioletRed Burlywood LightSalmon DarkSalmon
RosyBrown Salmon LightCoral Coral Tomato
OrangeRed Red IndianRed Crimson Firebrick
Brown Sienna SaddleBrown DarkRed Maroon
Tan SandyBrown Orange DarkOrange Chocolate
Peru DarkSeaGreen DarkKhaki Yellow Gold
Goldenrod DarkGoldenrod OliveDrab ForestGreen Green
Olive DarkOliveGreen DarkGreen SeaGreen MediumSeaGreen
LimeGreen YellowGreen Chartreuse GreenYellow LawnGreen
Lime MediumSpringGreen SpringGreen LightGreen PaleGreen
Cyan PaleTurquoise PowderBlue Turquoise MediumTurquoise
DarkTurquoise Aquamarine MediumAquamarine LightSeaGreen CadetBlue
DarkCyan Teal LightSlateGray SlateGray Gray
DimGray DarkSlateGray Black
Varios atributos n <FONT COLOR="#FF0000" FACE="ARIAL" SIZE="7">
Salto de línea nn <br>
Encabezamientos <H1>Encabezamiento H1</H1>
<H2>Encabezamiento H2</H2>
<H3>Encabezamiento H3</H3>
<H4>Encabezamiento H4</H4>
<H5>Encabezamiento H5</H5>
<H6>Encabezamiento H6</H6>
Alineamiento del encabezado <H2 ALIGN="left">Alineación a la izquierda<H2>
<H2 ALIGN="center">Alineación al centro<H2>
<H2 ALIGN="right">Alineación a la derecha<H2>
Tabla de caracteres del Documento
Carácter CÓDIGO ENTIDAD Carácter CÓDIGO ENTIDAD Carácter CÓDIGO ENTIDAD
! ! -- « « « Ö Ö Ö
" " -- ¬ ¬ ¬ × × ×
# # -- ­ ­ Ø Ø Ø
$ $ -- ® ® ® Ù Ù Ù
% % -- ¯ ¯ ¯ Ú Ú Ú
& & -- ° ° ° Û Û Û
' ' -- ± ± ± Ü Ü Ü
( ( -- ² ² ² Ý Ý Ý
) ) -- ³ ³ ³ Þ Þ Þ
* * -- ´ ´ ´ ß ß ß
+ + -- µ µ µ à à à
, , -- ¶ ¶ ¶ á á á
- - -- · · · â â â
. . -- ¸ ¸ ¸ ã ã ã
/ / -- ¹ ¹ ¹ ä ä ä
: : -- º º º å å å
; ; -- » » » æ æ æ
< < -- ¼ ¼ ¼ ç ç ç
= = -- ½ ½ ½ è è è
> > -- ¾ ¾ ¾ é é é
? ? -- ¿ ¿ ¿ ê ê ê
@ @ -- À À À ë ë ë
[ [ -- Á Á Á ì ì ì
\ \ -- Â Â Â í í í
] ] -- Ã Ã Ã î î î
^ ^ -- Ä Ä Ä ï ï ï
_ _ -- Å Å Å ð ð ð
` ` -- Æ Æ Æ ñ ñ ñ
{ { -- Ç Ç Ç ò ò ò
| | -- È È È ó ó ó
} } -- É É É ô ô ô
~ ~ -- Ê Ê Ê õ õ õ
    Ë Ë Ë ö ö ö
¡ ¡ ¡ Ì Ì Ì ÷ ÷ ÷
¢ ¢ ¢ Í Í Í ø ø ø
£ £ £ Î Î Î ù ù ù
¤ ¤ ¤ Ï Ï Ï ú ú ú
¥ ¥ ¥ Ð Ð Ð û û û
¦ ¦ ¦ Ñ Ñ Ñ ü ü ü
§ § § Ò Ò Ò ý ý ý
¨ ¨ ¨ Ó Ó Ó þ þ þ
© © © Ô Ô Ô ÿ ÿ ÿ
ª ª ª Õ Õ Õ
Espaciado Uniforme
Bien, con la sentencia <PRE> (PREFORMATO) podemos evitarlo y hacer que el navegador muestre las cosas
tal y como las hemos tecleado en el Bloc de Notas, pero usando una fuente con espaciado uniforme.
Listas de elementos Listas numeradas
Las listas numeradas representarán los elementos de la lista numerando cada uno de ellos según el lugar
que ocupan en la lista. Para este tipo de lista se utiliza la directiva <OL></OL>. Cada uno de los elementos
de la lista irá precedido de la directiva <LI>. La directiva <OL> puede llevar los siguientes parámetros:
start = num
Indica que número será el primero de la lista. Si no se indica se entiende que empezará por el número 1. Se
indica numéricamente, independientemente del tipo que se elija.
type = tipo
Indica el tipo de numeración utilizada. Si no se indica se entiende que será una lista ordenada
numéricamente.
Los tipos posibles son:
1 = Numéricamente. (1, 2, 3, 4, ... etc.)
a = Letras minúsculas. (a, b, c, d, ... etc.)
A = Letras mayúsculas. (A, B, C, D, ... etc.)
i = Números romanos en minúsculas. (i, ii, iii, iv, v, ... etc.)
I = Números romanos en mayúsculas. (I, II, III, IV, V, ... etc.)
Ejemplo Resultado
<OL> <LI>Fila1
<LI> Fila2
<LI> Fila3
<LI> Fila4
</OL>
1. Fila1
2. Fila2
3. Fila3
4. Fila4
<OL type = A >
<LI> Fila1
<LI> Fila2
<LI> Fila3
<LI> Fila4
</OL>
A. Fila1
B. Fila2
C. Fila3
D. Fila4
Listas sin numerar
Las listas sin numerar representan los elementos de la lista con un "topo" o marca que antecede a cada uno
de ellos. Se utiliza la directiva <UL></UL> para delimitar la lista, y <LI> para indicar cada uno de los
elementos. La directiva <UL> puede contener el parámetro type que indica la forma del "topo" o marca que
antecede a cada elemento de la lista. Los valores de type pueden ser disc, circle o square, con lo que el topo
o marca puede ser un disco, un círculo o un cuadrado.
Ejemplo Resultado
<UL type = disc >
<LI> Fila1
<LI> Fila2
<LI> Fila3
<LI> Fila4
</UL>
Fila1
Fila2
Fila3
Fila4
<UL type = square>
<LI> Fila1
<LI> Fila2
<LI> Fila3
<LI> Fila4
</UL>
Fila1
Fila2
Fila3
Fila4
Listas de definición
Las listas de definición muestran los elementos tipo Diccionario, o sea, término y definición. Se utiliza para
ellas la directiva <DL></DL>. El elemento marcado como término se antecede de la directiva <DT>, el
marcado como definición se antecede de la directiva <DD>.
Ejemplo Resultado
<DL> <DT>WWW
WWW
Abreviatura de World Wide Web
<DD>Abreviatura de World Wide Web
<DT>FTP
<DD>Abreviatura de File Transfer Protocol
<DT>IRC
<DD>Abreviatura de Internet Relay Chat
</DL>
FTP
Abreviatura de File Transfer Protocol
IRC
Abreviatura de Internet Relay Chat
Existen otros dos tipos de listas menos comunes. Las listas de Menú o Directorio se comportan igual que las
listas sin numerar. La lista de Menú utiliza la directiva <MENU></MENU> y los elementos se anteceden
de <LI> El resultado es una lista sin numerar más "compacta" es decir, con menos espacio interlineal entre
los elementos. La lista de Directorio utiliza la directiva <DIR></DIR> y los elementos se anteceden de
<LI>. Los elementos tienen un límite de 20 caracteres.
Listas anidadas
Todas las listas se pueden "anidar", es decir incluir una lista dentro de otra, con lo que se consigue una
estructura tipo "índice de materias".
Ejemplo Resultado
<UL type= disc>
<LI>Buscadores
<UL> <LI>Google
<LI>Yahoo
<LI>Ole
<LI>El índice
</UL> <LI>Links
<UL> <LI>Pangea
<LI>PIE
</UL>
</UL>
Buscadores
Yahoo
Ole
El índice
Links
Pangea
PIE
Imágenes <IMG src="leon.jpg" >
Hay dos formatos de imágenes que todos los navegadores modernos reconocen. Son las imágenes GIF
y JPG. Cualquier otro tipo de fichero gráfico o de imagen (BMP, PCX, CDR, etc...) no será mostrado
por el visor, a no ser que disponga de un programa externo que permita su visualización.
La directiva <IMG>
src = "imagen"
Indica el nombre del fichero gráfico a mostrar.
alt = "Texto"
Mostrará el texto indicado en el caso de que el navegador utilizado para ver la página no sea capaz de
visualizar la imagen.
align = TOP / MIDDLE / BOTTOM
Las imágenes, por defecto, se comportan como si fueran un carácter, alineándose en la misma línea que el
texto que las precede o que las sigue. Éste parámetro indica cómo se alineará el texto que siga a la imagen
con respecto a ésta. TOP alinea el texto con la parte superior de la imagen, MIDDLE con la parte central, y
BOTTOM con la parte inferior. Otras opciones más avanzadas serían: TEXTTOP se alinea justo al
comienzo del texto más alto de la línea, ABSMIDDLE, se alinea en el centro real de la imagen y
ABSBOTTOM, coloca el texto justo al final de la imagen. Estos tres parámetros son más precisos, pero no
todos los navegadores los aceptan.
align = LEFT / RIGHT
Si en el parámetro align tiene los valores left o right, la imagen dejará de comportarse como un carácter
colocándose a la izquierda o a la derecha y permitiendo escribir texto a su otro lado (si no, sólo se podrá
escribir una línea).
border = tamaño
Indica el tamaño del "borde" de la imagen. A toda imagen se le asigna un borde que será visible cuando la
imagen forme parte de un Hyperenlace.
height = tamaño
Indica el alto de la imagen en puntos o en porcentaje. Se puede usar para variar el tamaño de la imagen
original, aunque es mejor redimensionarla en un programa de retoque fotográfico ya que será de mejor
calidad y el archivo tendrá el tamaño apropiado.
width = tamaño
Indica el ancho de la imagen en puntos o en porcentaje. Se puede usar para variar el tamaño de la imagen
original, aunque es mejor redimensionarla en un programa de retoque fotográfico ya que será de mejor
calidad y el archivo tendrá el tamaño apropiado.
hspace = margen
Indica el número de espacios horizontales, en puntos, que separarán la imagen del texto que la siga y la
anteceda.
vspace = margen
Indica el número de puntos verticales que separaran la imagen del texto que le siga y la anteceda.
Comentarios <!-—comentario-->
Tablas Estructura de una tabla
Vamos a ver ordenadamente (de fuera hacia dentro) las etiquetas necesarias para confeccionar las tablas.
1. La etiqueta general, que engloba a todas las demás es <TABLE> y </TABLE>. Es decir:
<TABLE> [resto de las etiquetas] </TABLE> Con esto se presentarían los datos tabulados, pero faltaría la característica que hace más atractivas a las
tablas, y es que estos datos vayan dentro de unos cajetines formados por un borde. Para esto tenemos que
añadir el atributo BORDER a la etiqueta, es decir:
<TABLE BORDER> [resto de las etiquetas] </TABLE> 2. En el siguiente nivel, dentro de la anterior, están las etiquetas para formar cada fila (row) de la tabla,
que son <TR> y </TR>. Hay que repetirlas tantas veces como filas queremos que tenga la tabla. Es decir,
para una tabla con dos filas, sería:
<TR> [etiquetas de las distintas celdas de la primera fila] </TR> <TR> [etiquetas de las distintas celdas de la segunda fila] </TR> 3. En el último nivel (dentro de las anteriores) están las etiquetas de cada celda, que son <TD> y </TD>,
que engloban el contenido de cada celda concreta (texto, imágenes, etc.). Hay que repetirla tantas veces
como celdas queremos que haya en esa fila.
Tabla con bordes
Tabla sin bordes
border="0"
Tabla con borde ancho border="5" Aumentamos el tamaño de las celdas cellpadding="15"
Aumentamos el espacio entre las celdas cellspacing="20"
Título de la tabla <CAPTION> TÍTULO </CAPTION> Celdas de cabecera
<TR> <TH>Columna 1</TH> <TH>Columna 2</TH> <TH>Columna 3</TH> </TR> Que resulta:
Se pueden colocar en el sitio que se quiera, aunque lo normal es que vayan en los bordes., encabezando las
columnas o las filas.
Contenido de las celdas
Hasta ahora, en todos los ejemplos se ha puesto un texto normal dentro de las distintas celdas. Pero se puede
poner en ellas cualquier otro elemento de los que van en un documento HTML, como imágenes, enlaces,
etc. No hay más que poner dentro de la etiqueta de la celda la etiqueta correspondiente a una imagen, un
enlace, etc.
Ejemplo con una imagen:
<TABLE> <TR><TD><IMG SRC="imagen.gif"></TD></TR> </TABLE>
Posicionamiento del contenido dentro de la celda
Alineamiento horizontal dentro de la celda
<TD ALIGN=CENTER> Al centro </TD>
<TD ALIGN=RIGHT> A la derecha </TD>
<TD ALIGN=LEFT> izquierda </TD>
Alineamiento vertical dentro de la celda
<TD VALIGN=TOP> ARRIBA </TD>
<TD VALIGN=BOTTOM> ABAJO </TD>
Variando las dimensiones de la tabla <TABLE WIDTH=60% HEIGHT=40%>
<TABLE WIDTH=400 HEIGHT=300> Filas con desigual número de celdas
Celdas que abarcan a otras varias <TR> <TD COLSPAN=2> Celda sobre 2 columnas </TD> <TR> <TD ROWSPAN=2> Celda junto a 2 filas </TD>
Color de fondo en las tablas 1. Que la totalidad de la tabla tenga un color de fondo. Para ello, colocamos el atributo dentro de la
etiqueta TABLE. Por ejemplo, vamos a hacer que la tabla tenga un fondo verde (#00FF00):
<TABLE BORDER BGCOLOR="#00FF00"> <TR> <TD>fila1-celda1</TD> <TD>fila1-celda2</TD> </TR> <TR> <TD>fila2-celda1</TD> <TD>fila2-celda2</TD> </TR> </TABLE> 2. Que solamente una celda determinada tenga un color de fondo. Para ello, colocamos el atributo
dentro de la etiqueta de la celda correspondiente. Por ejemplo, vamos a hacer que sólo la celda 1 de la fila 1
tenga un color verde:
<TABLE BORDER> <TR><TD BGCOLOR="#00FF00">fila1-celda1</TD><TD>fila1-celda2</TD></TR> <TR> <TD>fila2-celda1</TD> <TD>fila2-celda2</TD> </TR> </TABLE> 3. Que la generalidad de las celdas tenga un color, pero que alguna celda tenga uno particular. El
atributo del color general se coloca en la etiqueta TABLE, y el del color particular en la etiqueta de la celda en
cuestión (una combinación de los dos casos anteriores). por ejemplo, vamos a hacer que la generalidad de
la tabla sea de color rojo (#FF0000), pero que la celda 1 de la fila 1 sea de color verde (#00FF00):
<TABLE BORDER BGCOLOR="#FF0000"> <TR><TD BGCOLOR="#00FF00">fila1-celda1</TD><TD>fila1-celda2</TD></TR> <TR> <TD>fila2-celda1</TD> <TD>fila2-celda2</TD> </TR> </TABLE>
Imágenes de fondo en las tablas
<TABLE BORDER BACKGROUND="león.jpg"> (Se omite el resto de las etiquetas de la tabla)
Si, se pone este atributo dentro de la etiqueta de una fila: <TR BACKGROUND="leon.jpg"> se verá sólo en esa fila, como por ejemplo:
Si, por el contrario, sólo se pone este atributo dentro de la etiqueta de una celda concreta <TD BACKGROUND="leon.jpg"> entonces la imagen de fondo se verá sólo en esa celda, como por ejemplo:
Separación entre las celdas de una tabla
<TABLE BORDER CELLSPACING=20> (Se omite el resto de las etiquetas de la tabla) <TABLE BORDER=5 CELLSPACING=20>; Separación entre el borde y el contenido dentro de las celdas
Por defecto, la separación entre el borde y el contenido dentro de las celdas es de un pixel. Se puede
cambiar esto con el atributo CELLPADDING, que se pone dentro de la etiqueta TABLE.
Por ejemplo, para obtener una separación de 20 pixels entre el contenido y los bordes, dentro de cada celda: <TABLE BORDER CELLPADDING=20>;
Se puede combinar este atributo con CELLSPACING (visto en el apartado anterior).
Por ejemplo, una tabla con bordes de 5 de espesor, separación entre celdas de 15 y separación del contenido
con respecto a los bordes de las celdas de 20, lo obtendríamos con: <TABLE BORDER=5 CELLSPACING=15 CELLPADDING=20>;
(Se omite el resto de las etiquetas de la tabla)
Hiperenlaces <a> </a> Un hiperenlace, hipervínculo, o vínculo, no es más que un enlace, que al ser pulsado lleva de una página o
archivo.
Hiperenlace <a> </a>
Aquellos elementos (texto, imágenes, etc.) sobre los que se desee insertar un enlace han de encontrarse entre
las etiquetas <a> y </a>, especificando con el atributo href la página a la que está asociado el enlace,
Referencia absoluta
<a href="http://www.google.es/index.html">Visita www.google.es/index.html</a> Referencia relativa
<a href="HTML006.html">Enlace a fondo de página</a>
Marcos o Frames
Marcos horizontales
<HTML> <HEAD> <TITLE>HTML47</TITLE> </HEAD> <FRAMESET COLS="20%, 80%"> <FRAME SRC=" HTML008.html " NAME="HTML08"> <FRAME SRC=" HTML009.html " NAME="HTML09"> </FRAMESET> </HTML>
Marcos verticales
Marcos mixtos
Es posible adoptar simultáneamente una división tanto en columnas como en filas, de manera que se cree
una ventana dividida en varios marcos. Veamos cómo debemos intervenir en el código HTML del
documento según el número y la posición de los marcos que queremos crear.
Para eliminar el borde gris de los marcos, se debe insertar el siguiente código:
<FRAMESET COLS="70%,30%" BORDER=0>
Sonido
Sonido activado por el usuario
<A HREF="musica.mp3">Pulsa para escuchar la música<A>
Sonido de fondo
<EMBED SRC="mid1.mid" WIDTH=2 HEIGHT=0 AUTOSTART="true" hidden> Esta etiqueta tiene los siguiente parámetros:
Parámetro Utilidad
SRC Contiene el nombre de archivo de sonido a reproducir
WIDTH y HEIGHT En Netscape aparece un pequeño reproductor, estos parámetros especifican su
tamaño.
AUTOSTART="true" Arranca automáticamente la reproducción.
LOOP="true" Reproduce ininterrumpidamente el fichero hasta que salimos de la página.
HIDDEN="true" Oculta el reproductor.
Sonido de fondo en Java
<html> <body> <div id="fantasma"><embed src=mid1.mid autostart=true hidden=true></div> <script language="javascript"> function enciende(){ document.getElementById("fantasma").innerHTML = "<embed src=mid1.mid autostart=true hidden=true>" } function apaga(){ document.getElementById("fantasma").innerHTML = "<embed src=mid1.mid autostart=false hidden=true>" } </script> <input type=button value="Activa el Sonido" onClick="enciende()"><br><br> <input type=button value="Desactiva el sonido" onClick="apaga()"> </body> </html>
Texto en movimiento
Marquesinas (Marquees) <MARQUEE> Texto que se desplaza </MARQUEE> Atributos de las marquesinas
WIDHT, HEIGHT
WIDHT: Ajusta la anchura de la marquesina
HEIGHT: Ajusta la altura de la marquesina
<MARQUEE WIDTH=50% HEIGHT=60>
ALIGN : Modifica el alineamiento del texto que rodea a la marquesina, que puede ser TOP (arriba),
MIDDLE (en medio) o BOTTOM (abajo). Ejemplo:
<MARQUEE WIDTH=50% HEIGHT=200 ALIGN=botton>
BEHAVIOR
Este atributo (que quiere decir en inglés comportamiento) sirve para definir de qué manera se va a efectuar
el desplazmiento del texto. Si es igual a SCROLL (el valor por defecto), el texto aparece por un lado, se
desplaza hasta el otro hasta desaparecer por él, y vuelve a empezar (como los casos que hemos visto
anteriormente). Si es igual a SLIDE, aparece por un lado y se desplaza hasta llegar al otro extremo, y se para
ahí. Si es igual a ALTERNATE se desplaza alternativamente hacia un lado y otro, siempre dentro de los
límites de la marquesina. Ejemplo:
<MARQUEE BEHAVIOR=ALTERNATE> Este texto se mueve a un lado y otro, sin desaparecer </MARQUEE>
BGCOLOR
Con este atributo se modifica el color de fondo de la marquesina.
<MARQUEE BGCOLOR="#FF7070"> Esta marquesina tiene un fondo de color rojo </MARQUEE>
DIRECTION
Este atributo sirve para modificar la dirección hacia la que se dirige el texto.
Por defecto es LEFT (izquierda). Se puede hacer que el texto se dirija hacia la derecha igualando este
atributo a RIGHT.
<MARQUEE DIRECTION=RIGHT> Este texto se dirige hacia la derecha </MARQUEE>
SCROLLAMOUNT
Define la cantidad de desplazamiento del texto en cada movimiento de avance, expresado en pixels. Cuanto
mayor es el número, más rápido avanza.
<MARQUEE SCROLLAMOUNT=50> Este texto se mueve rápidamente </MARQUEE>
SCROLLDELAY
Define el tiempo entre cada movimiento de avance, expresado en milisegundos.
Cuanto mayor es el número más lento avanza.
<MARQUEE SCROLLDELAY=200> Este texto se mueve lentamente </MARQUEE>
LOOP
Especifica el número de veces que aparecerá el texto.
Es indefinido por defecto.
<MARQUEE LOOP=5 > texto </MARQUEE>
HSPACE, VSPACE
Definen, respectivamente, la separación en sentido horizontal o vertical del texto que está fuera de la
marquesina.
<MARQUEE HSPACE=60 VSPACE=30 > texto </MARQUEE>
Marquesina dentro de una tabla
<TABLE BORDER=1> <TR><TD> <MARQUEE> Marquesina dentro de una tabla </MARQUEE> </TD></TR> </TABLE>