[2016-16-08]
CLASE 25:
Los estudiantes del Grado Noveno B realizaron la salida a la Universidad Industrial de Santander, celebración Festival de Piano.
INCLUIR SONIDO EN UNA PÁGINA WEB
- Se debe utilizar el elemento <audio>. Este solo funciona con los browsers Internet Explorer 9+, Chrome, Safari, Firefox y Opera.
- Conviene incluir una frase de advertencia para los usuarios que utilicen versiones de browser más antiguas.
1.‐ El código básico para incluir sonido en la Página Web es:
<audio control>
<source src="tema musical.mp3"type="audio/mpeg">
<source src="tema musical.ogg"type="audio/ogg">
</source></audio>
Esto hace aparecer en la pantalla una barra de sonido según el browser.
2. Se puede agregar información del audio como un texto informativo sobre
el tema musical (título, músicos, duración, etc.) para realizar esto se debe
utilizar la etiqueta <p>.
<p>Texto informativo sobre el tema musical (título, músicos,
duración, etc.)</p>
<audio
controls="">
<source src="tema
musical.mp3" type="audio/mpeg">
<source src="tema
musical.ogg" type="audio/ogg">
Solo funciona con Internet Explorer 9+, Firefox, Opera, Chrome, y
Safari.
</source></audio>
3. Cuando se quieren incluir varios
temas musicales, cada [comando de audio] debe estar encerrado y separado de los
demás utilizando (por ejemplo) el elemento <div> ….</div>, o colocándolo dentro de la
celda de una tabla.
ATRIBUTOS DEL ELEMENTO <audio> :
- Autoplay: El sonido comenzará tan pronto esté disponible.
- Controls: Mostrar en Pantalla la barra de Control de Sonido.
- Loop: El sonido debe repetirse permanentemente.
- Muted: Silenciar.
- Preload: El archivo de sonido debe ser cargado (y cómo) cuando se carga la página.
- Src: Especifica el sitio (URL) donde se encuentra el archivo de sonido.
El elemento <audio>, atributos y elementos
complementarios <source>:
- <audio controls=” ”> Indica que el browser debe mostrar la barra de control para escuchar el tema musical.
- <source src="tema musical.mp3" type="audio/mpeg"> Indica la fuente de donde se tomará el audio correspondiente.
- type , indica qué formato de audio se está utilizando (por ejemplo “audio/mpeg>”.
En el código se incluyen dos formatos de audio posibles
(mpeg y ogg). Esto se debe a que los browsers tienen sus
preferencias; de este modo si no se reconoce el primero (mpeg) , se opta por el
segundo (ogg).
MP3 es más pesado que el formato OGG. Con archivos MP3, los browsers Safari y Opera no responden.
TOMADO DE:
PONER FONDO A LA PÁGINA WEB
El atributo de CSS que nos permite poner el fondo de la página web es background. Para poner el fondo de la página web, lo tendremos que utilizar sobre el elemento body.
Estructura del elemento background:
background: [color] [image] [repeat] [attachment] [position];
Podemos indicarle:
- Color RGB.
- Una imagen.
- Indicar cómo se repite o si no se repite.
- Indicar si se queda fijo(fixed) o en formato scroll.
- Indicar la posición inicial en la que se situará la imagen.
El código CSS quedará de la siguiente forma:
1. <style type="text/css">
2. body {
3. background:url(fondo.gif) repeat 0 0;
4. }
5. </style>
Hay
que recordar que este código lo tenemos que poner antes de la etiqueta head.
Utilizamos
la función url () para indicar el
directorio dónde se encuentra la imagen. Si queremos utilizar otro directorio
podemos poner lo siguiente:
1. <style type="text/css">
2. body {
3. background:url('/imagenes/fondo.gif') repeat 0 0;
4. }
5. </style>
Ahora
la imagen se encuentra en un directorio llamado "imagenes" que está
en la raiz.
Por
último tenemos que saber que existe otra propiedad llamada:
background-image, permite indicar la
imagen a utilizar como fondo de mi página web, si no nos queremos preocupar del
resto de atributos.
En este caso el código quedaría de la siguiente forma:
1. <style type="text/css">
2. body {
3. background-image:url('/imagenes/fondo.gif');
4. }
5. </style>
TOMADO DE:



No hay comentarios:
Publicar un comentario