Curso basico con_html

DESCRIPCION INICIO FINAL COMENTARIOS
Obligatorias
Principio de
Documento
<html> </html>
Toda la codificación
debe estar incluida en
estas etiquetas
Encabezado <head> </head>
Dentro del encabezado
se encontrará el título.
Título <title> </title>
Es el texto que aparece
en la barra de títulos del
navegador
Cuerpo <body> </body> Cuerpo de la página
Para toda la página
Color de Fondo
<body bgcolor="#RRVVAA">
Permite colocar un
color uniforme de fondo
a toda la página. Este
color estará formado
por 3 números
hexadecimales que
indiquen:
RR = tonalidad de color
rojo
VV = tonalidad del
color verde
AA = tonalidad del
color azul
Imagen de Fondo
<body
background="nombreimagen.gif">
nombreimagen.gif
deberá reemplazarse por
el nombre de la imagen.
Se recomienda utilizar
formatos .gif o .jpg
Colores de texto
color de enlaces
enlaces visitados
enlaces activos
<body text="#RRVVAA"
Link ="#RRVVAA"
Vlink ="#RRVVAA"
Alink ="#RRVVAA"
Permite definir los
colores que se aplicarán
en forma genérica para
el texto como para los
enlaces. El color está
representado por un
número hexadecimal
Estilos <style> </style>
Permite definir un estilo
de fuente, color,
tamaño, etc para todo el
documento.
Meta
<meta
name="description"
content="comentarios"
name="keywords" content="palabra1
palabra2 ... palabran">
</meta>
Permite definir
propiedades internas del
documento.
Name = "description"
content = ”Será el
resumen con que se
publicará en el
buscador. No utilizar
más de 25 palabras"
Name = "keywords"
content = "podrán
definirse palabras
claves para que nuestro
documento sea
encontrado por los
buscadores"
Sonido <bgsound
src="xx.wav"
loop=infinite/n>
<embed
src="xx.wav"
width=200 height=55
autostart="true"
loop="true"
hidden="true">
Ejecuta un archivo de
sonido.
xx.wav se debe
reemplazar por el
nombre del archivo;
loop n indica la
cantidad de veces que
se repetirá.
La etiqueta Embed con
sus propiedades, se
utiliza por las

incompatibilidades de
los navegadores.
Con esta opción aparece
una consola cuyas di-
mensiones se definen
con Width o Height y
que puede ocultarse con
Hidden = "true"
Presentación de texto
Encabezamientos <h1><h2>....<h6> </h1></h2>....</h6>
Opciones de formato de
texto para encabezados,
Negrita
Cursiva
Subrayado
<b>
<i>
<u>
</b>
</i>
</u>
Coloca el texto incluido
con éstos formatos.
Parpadeo <blink> </blink>
El texto estará
parpadeante
Grande
Pequeña
<big>
<small>
</big>
</small>
Agranda el texto
Disminuye el texto
Subíndice
Superíndice
<sub>
<sup>
</sub>
</sup>
Representa el texto
sobre el renglón o bajo
el renglón.
Color del Texto <font color="#RRVVAA"> </font>
Permite colocar un
color a la fuente. El
color está representado
por un número
hexadecimal.
Tamaño del
Texto
<font size="n"> </font>
Define un tamaño de
fuente específico. n
repre-senta un número
del 0 al 7 al que luego
podrán agregarle los
signos + o -
Tipo de fuente <font face="nombre de fuente"> </font>
Permite definir un
nombre de Fuente
específico.
Estilo de fuente <tt> </tt>
Formato de fuente
Courier de tamaño
menor (Typewriter)
Texto
preformateado
<pre> </pre>
Formato de fuente tipo
Courier. Se representan
los espacios en blanco
Texto en
Movimiento
<marquee>(texto) </marquee>
Permite que un texto
tenga movimiento.
Pueden agregarse
atributos para
dimensionar la
marquesina, para alinear
el texto, para modificar
tamaño, fuente y color.
Línea Horizontal <hr="n"> No utiliza etiqueta de
cierre
Traza un línea
horizontal cuyo grosor
está representado por
“n”
Espacio en
Blanco
&nbsp No utiliza etiqueta de
cierre
Representa un espacio
en blanco.
Comentario <!- comentario> ->
Comentarios que no
serán visibles en la
pantalla.

Caracteres
especiales
Escribo Para ver
< <
> >
& &
" "
á á
é é
&iacute í
ó ó
ú ú
Á Á
É É
Í Í
Ó Ó
Ú Ú
ñ ñ
Ñ Ñ
ü ü
Ü Ü
¿ ¿
¡ ¡
Permiten que los
caracteres especiales
sean leídos por todos
los navegadores en sus
distintas versiones.
La escritura de cada
carácter comienza con
el signo ampersand (&)
y debe terminar con
punto y coma (;)
En esta tabla vemos
como escribir algunos
símbolos, signos, las
letras Ñ y ñ, y las
vocales acentuadas en
mayúscula y minúscula.
Presentación de párrafos
Alineaciones
<center>
<left>
<right>
</center>
</left>
</right>
Todo texto que se
escriba entre estas
etiquetas sufrirá esa
alineación .
Sangría <blockquote> </blockquote>
Se utiliza para destacar
una cita.
Parrafo
<p align= center*left*right*justify> </p>
Realiza la separación
entre párrafos, y la
alineación de estos.
Renglones en
blanco
<br>
Permite dejar renglones
en blanco
Tratamiento de imágenes
Imagen
Individual
<img src="nombreimagen.gif">
Permite insertar una
imagen en la página que
estamos diseñando. El
archivo de la imagen
deberá estar ubicado en
la misma carpeta que la
página, caso contrario
se deberá indicar su ruta
de acceso
Texto de la
imagen
<img src="nombreimagen.gif"
alt="texto">
Coloca un texto que po-
drá leerse al pasar el
puntero del ratón sobre
la imagen o cuando ésta
no se carga.
Alineación del
texto
align= top * middle * bottom>
Indicará la posición en
que ubicaremos al texto
que acompaña a la
imagen
Top Arriba * Middle
Medio * Bottom Abajo

Ancho
Alto
width="n"
height="n">
Define el tamaño de la
imagen
Width = ancho *
height = altura n = será
un valor en pixeles
Videos
<img dynsrc="archivi.avi"
loop=infinite controls
start= mouseover>
Permite agregar
archivos de video.
Listas
Lista numerada
<ol type= A * a * I * i start=n>
<lh> título de la lista </lh>
<li> Primera opción
<li> Segunda opción
<li> Tercera opción
</ol>
Se utiliza cuando las
opciones deben ser
numerados. La opción
type representan
número o letras y start
indicará el número con
que inicia.
Lista no
ordenada
<ul type=square * circle * disk>
<li> Primera opción
<li> Segunda opción
<li> Tercera opción
</ul>
opciones no presentan
un orden determinado.
La opción type
representa la viñeta.
Lista con
sangrado
<dl>
<dt> Primer tema
<dd> Primer detalle
<dd> Segundo detalle
<dt> Segundo tema
<dd> Tercer detalle
<dd> Cuarto detalle
</dl>
opciones llevan un
título y una definición
Enlaces o Links
Enlace a otro
URL
<a href="xxx"> yyy </a>
xxx se debe reemplazar
por la dirección URL
destino del enlace.
yyy es el texto
indicativo que se leerá
en la página.
Enlace a un
e-mail
<a href = "mailto:dirección e-mail">
texto indicativo del enlace
</a>
Te permite un enlace
directo a tu cliente de
correo predeterminado
Marca para
enlace dentro de
la misma página
(Ancla - Anchor)
<a href="#marca"> Texto de enlace al
ancla
</a>
Referencia una posición
a la que luego se
accederá.
Localizar enlace
anterior
<a name="marca"> texto del ancla </a>
Enlaza una posición
previamente marcada,
dentro de la misma
página
Enlace a otra
página con
marca, dentro del
mismo sitio
<a href="ab.htm#marca"> texto
indicativo del enlace
</a>
Enlaza a la posición
establecida en marca, en
la página ab.htm
Enlace con
imagenes
<a href="xxx"><img
src="nombreimagen.gif">
</a>
xxx se debe reemplazar
por la dirección URL
destino del enlace.
nombreimagen.gif se
debe reemplazar por el
nombre de imagen
seleccionado
Enlaza a la dirección
URL haciendo un click
sobre la imagen.
Tablas

Definición <table> </table> Crea una tabla
Bordes
Color de Bordes
<table border=n
bordercolor="#RRVVAA">
n = representa al grosor
del borde. También se
podrá especificar el
color del borde
Separación entre
celdas
<table cellspacing=n>
Las celdas podrán sepa-
rarse por el n valor
Separación entre
el borde y el
contenido
<table cellpadding=n>
El contenido podrá estar
separado del borde por
el valor indicado en n
Alto
ancho
<table height=n o porcentaje
width=n o porcentaje>
Se puede establecer un
valor o un porcentaje
para definir el tamaño
de la tabla
Color de Fondo o
Imagen de Fondo
<table bgcolor="#RRVVAA"
background="imagen.gif">
Se puede establecer un
color de fondo de toda
la tabla o colocar una
imagen de fondo
Título
<caption
align=top * bottom> texto del título
</caption>
Posibilita colocar un
título a la tabla alineado
top=arriba o
bottom=abajo
Definición de filas
<tr
align=left*center*right
valign=top*middle*bottom
bgcolor="#RRVVAA">
</tr>
Por cada fila que tenga
la tabla deberá utilizarse
esta etiqueta: se podrá
establecer la alineación
del contenido, la
ubicación dentro de la
fila y el color de fondo.
Definición de
títulos
<th
align=left*center*right*justify*decimal
valign=top*middle*bottom*baseline
bgcolor="#RRVVAA">
</th>
Permite definir los
nombres de las
columnas.
Definición de
datos o
contenidos
<td
align=left*center*right*justify*decimal
valign=top*middle*bottom*baseline
bgcolor="#RRVVAA">
</td>
Coloca contenidos a
cada celda
Celda que ocupa
muchas filas
<td rowspan=numero de filas> </td>
Se puede combinar una
celda para que ocupe
muchas filas.
Celda que ocupa
muchas columnas
<td colspan=numero de columnas> </td>
Se puede combinar una
celda para que ocupe
muchas columnas.
Ejercicio paso a paso. Insertar una imagen
Objetivo.
Practicar las operaciones que hay que realizar para insertar una imagen.
Si no tienes abierto el Bloc de notas, ábrelo para realizar el ejercicio.
Ejercicio
1 Abre el archivo inicio.htm, que se encuentra en la carpeta ejercicios_html/animales.
2 Sustituye la línea
<b> visita aulaclic </b>
que está incluida dentro de un hiperenlace, por la línea

<img src="imagenes/aulaclic.jpg" alt="visita aulaclic" width="90" height="32" border="4">
Con este código estarás asociando el enlace con la imagen aulaclic.jpg que se encuentra en la
directorio imagenes dentro de la carpeta animales (la carpeta donde se encuentra el archivo inicio.htm.
La imagen medirá 90 píxeles de ancho, y 32 píxeles de alto (atributos width y height).
Tendrá un borde de 4 píxeles (atributo border), que aparecerá de color rojo, al ser este color el definido
para los enlaces de esta página.
En el caso de que la imagen no pueda ser visualizada, o se situe el puntero sobre ella, se mostrará el
texto visita aulaclic (atributo alt).
3 Haz clic sobre la opción Guardar del menú Archivo.
4 Abre el documento inicio.htm, que acabas de guardar, en un navegador, y comprueba que obtienes
una pág
Ejercicio
1 Abre el documento menu.htm, de la carpeta originales/animales del curso.
2 Guarda la página con el mismo nombre en tu directorio de ejercicios Mis
documentos/ejercicios_html/animales
2 Añade delante de la primera etiqueta <p ... la siguiente línea:
<p align="center"><img src="imagenes/logo_animales.gif" width="122" height="85"> </p>
El párrafo se añade para centrar la imagen.
4 Abre el documento menu.htm, que acabas de guardar, en un navegador, y comprueba que obtienes
una pág.
Ejercicio
1 Abre el archivo gatos.htm, que se encuentra en la carpeta animales.
2 Añade detrás de la etiqueta </ul> la línea:
<img src="imagenes/gatito.gif" alt="gatito" border="0">
4 Abre el documento menu.htm, que acabas de guardar, en un navegador,
Veamos toda esta teoría con un ejemplo práctico:
<img src="imagen1.gif" alt="Foto de un perro lindo" height="113" width="150" align="top"> Esta foto es un perro
muy lindo.
El ejemplo produciría el siguiente resultado:
Esta foto es un perro muy lindo.
Ejercicio paso a paso. Trabajar con tablas
Objetivo.

Practicar las operaciones que hay que realizar para modificar las propiedades de la tabla.
Ejercicio
Vamos a insertar en la página gatos.htm una tabla para colocar la imagen del gatito a la izquierda de la
lista. Para eso crearemos una tabla de una fila y dos columnas, en la columna de la izquierda colocaremos
el texto y en la columna de la derecha la imagen.
1 Si no tienes abierto el Bloc de notas, ábrelo para realizar el ejercicio.
2 Haz clic sobre el menú Archivo.
3 Haz clic sobre la opción Abrir. Se abrirá una nueva ventana.
4 En Tipo:, elige Todos los archivos.
5 Selecciona el archivo gatos.htm, que se encuentra en la carpeta animales, y pulsa sobre el botón
Aceptar.
6 Detrás de la etiqueta <hr> añade el siguiente código para añadir una línea en blanco, definir la tabla,
empezar la definición de la primera fila y primera columna de la tabla. Hacemos la tabla invisible
(border="0") y que ocupe todo los ancho de la ventana (width="100%"), la primera columna ocupará el
70% de la ventana (width="70%") :
<br>
<table width="100%" border="0">
<tr>
<td width="70%">
7 Detrás de la última etiqueta </ul> añade el siguiente código para cerrar la columna y empezar la otra,
ahora la segunda columna ocupará el 30% de la ventana (width="30%"):
</td>
<td width="30%">
8 Detrás de la etiqueta <img> añade el siguiente código para cerrar la columna y cerrar la fila y la tabla:
</td>
</tr>
</table>
9 Guarda el archivo y cierra el bloc de notas.
10 Abre con tu navegador el archivo gatos.htm, comprueba que ahora la imagen está a la derecha del
texto y si haces la ventana más pequeña, el ancho de las columnas cambia.
Ejercicio
1 Abre el documento perros.htm, de la carpeta originales/animales del curso.
2 Guarda la página con el mismo nombre en tu directorio de ejercicios Mis
documentos/ejercicios_html/animales
En el documento que has abierto vamos a crear la siguiente tabla:
DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE
DIFERENCIAS
PERRO
HOMBRE
PEQUEÑO GRANDE
Duración crecimiento 10 meses 18 a 24 meses 16 años
Tiempo de gestación 58 a 63 días 9 meses
Duración de vida del pelo/cabello 1 año 2 a 7 años
Empezamos por definir la etiqueta de la tabla:
3 Escribe delante de la etiqueta </body>:

<table width="575" border="2" align="center" cellspacing="2" bordercolor="#000000" >
El atributo width nos permite definir la tabla de un tamaño fijo para que ese tamaño no cambie según el
tamaño de la ventana abierta.
Con el valor 2 del atributo border hacemos que el borde externo de la tabla aparezca más grueso.
El atributo align con el valor center nos permite indicar que la tabla estará centrada con respecto a la ventana.
Con el valor 2 del atributo cellspacing hacemos que aparezca un hueco entre las celdas de la tabla.
El atributo bordercolor nos permite definir el color del borde la tabla.
Para que no se nos olvide cerrar etiquetas es mejor añadir la etiqueta de cierre y después entre la dos
etiquetas añadir las otras.
4 Escribe:
</table>
La tabla tiene seis filas (contamos el número mayor de filas) y el texto contenido en ellas está centrado tanto
en horizontal como en vertical:
5 Escribe seis veces:
<tr align="center" valign="middle">
</tr>
Ya hemos definido las filas, ahora las vamos a rellenar con las columnas. Miramos cuál es la fila con mayor
número de columnas, tiene cuatro columnas.
Rellenamos la primera fila, en esta fila aparece una sola columna por lo que hay que indicar que esta se
expande sobre cuatro columnas:
6 Escribe después de la primera etiqueta <tr..:
<td colspan="4">DIFERENCIAS ENTRE EL PERRO Y EL HOMBRE</td>
Vamos a rellenar ahora la segunda fila.
En esta fila la primera columna se expande sobre dos filas:
7 Escribe después de la segunda etiqueta <tr..:
<td rowspan="2">DIFERENCIAS</td>
La segunda columna se expande sobre dos columnas:
8 Escribe a continuación:
<td colspan="2">PERRO</td>
La tercera columna se expande sobre dos filas:
9 Escribe a continuación:
<td rowspan="2">HOMBRE</td>
Vamos a rellenar ahora la tercera fila.
En esta fila sólo tenemos que definir dos columnas ya que la primera y la última están incluidas en el rowspan de
la fila anterior.
10 Escribe después de la tercera etiqueta <tr..:
<td>PEQUEÑO</td>
<td>GRANDE</td>

Vamos a rellenar ahora la cuarta fila.
En esta fila tenemos que definir las cuatro columnas normales
11 Escribe después de la cuarta etiqueta <tr..:
<td>Duración crecimiento</td>
<td>10 meses</td>
<td>18 a 24 meses</td>
<td>16 años</td>
Vamos a rellenar ahora la quinta fila.
En esta fila tenemos que indicar que la segunda columna se expande sobre dos columnas.
12 Escribe después de la quinta etiqueta <tr..:
<td>Tiempo de gestación</td>
<td colspan="2">58 a 63 días</td>
<td>9 meses</td>
Por último rellenamos la sexta fila.
En esta fila tenemos que indicar también que la segunda columna se expande sobre dos columnas.
13 Escribe después de la sexta etiqueta <tr..:
<td>Duración de vida del pelo/cabello</td>
<td colspan="2">1 año</td>
<td>2 a 7 años</td>
Veamos el resultado.
14 Guarda los cambios y abre la página con tu navegador.
Ahora añadiremos los colores de fondo. Si quieres puedes ir observando los cambios según los vayas
introduciendo, guardando sin cerrar el bloc de notas y cada vez actualizando la página en tu navegador (como
hiciste en el ejercicio paso a paso del tema 3).
15 Añade background="imagenes/fondopatas.gif" dentro de la etiqueta <table>. De este modo, la imagen
fondopatas.gif pasará a ser la imagen de fondo de la tabla.
16 Añade bgcolor="#669966" dentro de la primera etiqueta <tr>. De este modo, la primera fila de la tabla será
de color verde oscuro.
17 Añade bgcolor="#FFCC99" dentro de la segunda etiqueta <tr>. De este modo, la segunda fila de la tabla
será de color naranja.
18 Añade bgcolor="#FFFF99" dentro de la tercera etiqueta <tr>. De este modo, las celdas de esa fila, que
contienen el texto PEQUEÑO y GRANDE, serán de color amarillo.
Por último cambiaremos las tres primeras filas para que el texto contenido en ellas tenga formato de cabecera
de columna.
19 Sustituye td por th en las líneas que se encuentran entre los tres primeros pares de etiquetas <tr> y </tr>.
De este modo, las celdas de las tres primeras filas pasarán a ser títulos de columna, por lo que el texto aparecerá
centrado y en negrita.
20 Comprueba que obtienes una página
Ejercicio paso a paso. Insertar sonido de fondo
Objetivo.
Practicar las operaciones que hay que realizar para insertar sonido de fondo.

Primero añadiremos una música de fondo a una página.
1 Abre el archivo menu.htm, que se encuentra en la carpeta animales.
2 Inserta una línea en blanco debajo de la etiqueta <basefont>, y escribe el siguiente código en ella:
<bgsound src="varios/audioanimales.MID" loop="-1">
Con este código estarás estableciendo el archivo audioanimales.MID como sonido de fondo de la página,
que se reproducirá continuamente en un bucle infinito (loop="-1").
4 Abre el documento menu.htm, que acabas de guardar, en un navegador, y comprueba que obtienes una
página como la que aparece si pulsas aquí. No olvides encender unos altavoces que estén conectados a tu
ordenador, para comprobar que el archivo de audio se reproduce correctamente.
Ahora vamos a sustituir las palabras INICIO PERROS GATOS y CONSULTAS por botones Flash.
1 Abre otra vez el archivo menu.htm, que se encuentra en la carpeta animales.
2 Sustituye la palabra INICIO por el siguiente código:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0"
width="100" height="23">
<param name="movie" value="binicio.swf">
<param name="quality" value="high">
<embed src="binicio.swf" width="100" height="23" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" >
</embed>
</object>
Nota: se ha escrito en el color de los valores del usuario unicamente los valores que cambian al insertar un
botón Flash.
3 Sustituye la palabra PERROS por el siguiente código:
<param name="movie" value="bperros.swf">
<embed src="bperros.swf" width="100" height="23" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" >
</embed>
</object>
4 Sustituye la palabra GATOS por el siguiente código:
<param name="movie" value="bgatos.swf">
<embed src="bgatos.swf" width="100" height="23" quality="high"
pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"
base=".">
</embed>
</object>
5 Sustituye la palabra CONSULTAS por el siguiente código:
<param name="movie" value="bconsultas.swf">
<embed src="bconsultas.swf" width="100" height="23" quality="high"

pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash"
base=".">
</embed>
</object>
6 Haz clic sobre la opción Guardar del menú Archivo
Animaciones
• Marquee no está comprendido en los estándar HTML
• Utilizar Marquee puede tener problemas de accesibilidad, es decir, se puede hacer difícil de leer para
determinadas personas con discapacidades.
• El hecho de animar elementos de una página favorece el dinamismo y ayuda a llamar la atención sobre
determinados mensajes o imágenes, pero si utilizas marquee en muchos lugares puede provocar confusión y
marear al usuario.
Para utilizar marquee, simplemente colocamos dentro de la etiqueta los contenidos que queremos que se muevan, ya
sean texto, imágenes o cualquier otro tipo de contenido. Algo como esto:
<marquee>texto que se mueve</marquee>
Pero también podríamos meter algo como esto:
<marquee>
<table align="center" width="100"border="1">
<tr>
<td>Esta tabla se desplaza , con todo el contenido de la tabla</td>
</tr>
</table>
</marquee>
Marquee soporta una serie de atributos para modificar su comportamiento o su aspecto. Son los siguientes:
WIDTH
Anchura de la marquesina. Si no marcamos altura, se colocará en la siguiente línea, como en un párrafo distinto. Si
marcamos una anchura, la marquesina intentará mostrarse en la misma línea donde la hayamos colocado. Si no hay
espacio para ella se realizará el consiguiente salto de línea para mostrarla un poco más abajo.
DIRECTION
Hacia donde queremos que se displace el contenido del marquee. Los posibles valores son "LEFT" y "RIGHT".
BEHAVIOR
Es el comportamiento de la marquesina, de entre los posibles: SCROLL (el comportamiento por defecto) indica que
tiene que hacer el desplazamiento siempre en una misma dirección y ALTERNATE, que indica que el desplazamiento
se hace a un lado y al otro de manera alternada.
SCROLLDELAY
Es el tiempo en milisegundos que tiene que pasar entre cada cambio de la posición de lo que hay desplazándose. Es
decir, cuanto mayor sea el valor, más milisegundos tardará la marquesina en moverse. El valor por defecto es 85,
pero si por ejemplo ponemos un valor 500 la marquesina cambiará de estado (desplazará el contenido) cada medio
segundo.
SCROLLAMOUNT
Es la cantidad de pixel que tiene que desplazarse el contenido de la marquesina cada vez que se mueve. A mayor
scrollamount, más se desplazará la marquesina en cada movimiento y por tanto la animación será más rápida. El
valor por defecto es 6. Podemos probar a colocar un valor mayor y veremos que el movimiento será más "a golpes".
LOOP
El número de ciclos que va a moverse el texto o lo que quiera que haya dentro de la marquee. Este atributo sólo
funciona en Internet Explorer. Por defecto es INFINITE, que quiere decir que se desplazará todo el tiempo sin parar.
Pero si por ejemplo colocamos un valor como 3, querrá decir que la marquesina sólo realizará tres ciclos o
movimientos y luego parará.
BGCOLOR
El color de fondo de la marquesina. Acepta el nombre de un color HTML o bien un valor RGB de dicho color.

HSPACE y VSPACE
Estos dos atributos sirven para definir el número de píxel que debe aparecer entre la marquesina y otros contenidos
de la página, en horizontal y vertical.
Algunos ejemplos de marquee:
<marquee width=200 direction=right>
Marquesina a la derecha y con ancho
</marquee>
<marquee behaviour=alternate scrolldelay=500 bgcolor="#ff8833">texto que se mueve</marquee>
Sonido BGSOUND
La etiqueta bgsound incorpora sonidos de fondo en una página web, sonidos que se ejecutan automáticamente al
cargarse la página. Es una etiqueta propietaria de Microsoft, por lo que sólo es interpretada por Internet Explorer,
admitiendo los formatos de audio MID y WAV, aunque generalmente también acepta AU y MP3, en versiones
actuales del nevagador o mediante plugins de uso general.
Su sintaxis general, con sus atributos más importantes, es del tipo:
<bgsound src="ruta_fichero" loop="l" balance="b" volume="v"></bgsound>
Donde:
• src="ruta_fichero" fija la ruta en la que se encuentra el fichero de audio a reproducir. La ruta puede ser
relativa a nuestro sistema de carpetas local, absoluta respecto el sistema de carpetas del servidor web o una
URL completa que localice el fichero en Internet.
• loop="l" determina el número de veces (l) que se debe ejecutar el fichero de audio. Si le damos el valor
infinite, el fichero se reproducirá indefinidamente.
• balance="b" determina el balance del sonido entre los dos altavoces del equipo, es decir, la potencia o
intensidad con que se oirá en cada uno de ellos (derecho e izquierdo). Sus valores pueden estar entre
-10,000 y +10,000, correspondiendo el valor 0 a un balance equilibrado entre los dos altavoces.
• volume="v" fija el volumen al que se oirá el sonido, y sus valores pueden variar entre -10,000 (mínimo) y 0
(máximo). No es soportado por los equipos MAC.
Ejemplo:
<bgsound src="../sonidos/wav.wav" balance=0 volume=0></bgsound>

Curso basico con_html

Más contenido relacionado

La actualidad más candente (14)

Destacado (20)

Similar a Curso basico con_html (20)

Curso basico con_html