Aplicacion del Codigo :
Código :
#capa1{
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px solid black;
padding: 10px;
margin: 0 0 5px 0;
background:peru;
width:430px;
height: 20px;
}
Con la Capa #capa1 utilizando border-radius le indicamos un borde de 10px y añadiendo -moz- y -webkit- estas lineas nos aseguramos que pueder ser compatible con otros navegadores como por ejm Mozilla
Código :
<video width="450" height="340" controls="controls"> <source src="video.mp4" type="video/mp4" /> <div id="capa1">Su Navegador no soporta se recomienda usar Google Chrome</div> </video>
Esta linea es la mas importante del ejemplo en la cual vamos a poder reproducir nuestro video en mp4 adicional mente se coloco una capa <DIV> la cual solo aparece si el navegador conde se ejecute el codigo no soporte la etiqueta <Video>.
Código :
<!DOCTYPE HTML>
<html lang="es">
<meta charset='uft-8'/>
<style type="text/css" >
#capa1{
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border: 2px solid black;
padding: 10px;
margin: 0 0 5px 0;
background:peru;
width:430px;
height: 20px;
}
#pie {
width:450px;
vertical-align:top;
border-radius:15px;
-webkit-border-radius:15px;
-moz-border-radius:15px;
background:peru;
text-align:center;
height:20px;
border: 2px solid black;
}
#cuerpo{
width: 450px;
padding: 10px;
margin: 10px;
}
</style>
<body>
<title>Mi primer Video</title>
<h1>Mi Primer Ejemplos</h1>
<div id ="cuerpo">
<div id="capa1">Mi Primer Ejemplo usando la etiqueta <video> con HTML5 </div>
<video width="450" height="340" controls="controls">
<source src="video.mp4" type="video/mp4" />
<div id="capa1">Su Navegador no soporta se recomienda usar Google Chrome</div>
</video>
<div id="pie">Autor : Guillermo Rodriguez </div>
</div>
</body>
</html>
Nota- la esquitas <video> no es soportado en iexplore8 , una forma de comprobar si tu navegador soporta esta tecnologías te recomiendo entra a http://html5test.com/ , website que hace un evaluación de tu navegador indicándote si esta preparado para las nuevas etiquetas
Como tutorial, le falta mucho
