lunes, 2 de diciembre de 2013

Detectar las características de HTML5 y CSS3 con Modernizr

Modernizr es una biblioteca JavaScript de código abierto que facilita a los diseñadores web para desarrollar diferentes niveles de experiencias, sobre la base de las capacidades del navegador del visitante.
Esto permite a los diseñadores sacar el máximo provecho de todo en HTML5 y CSS3 que se implementa en algunos navegadores, sin sacrificar el control sobre la experiencia del usuario en otros navegadores.
Y sobre todo contestar la pregunta: ¿qué hacemos con IE 6-9?


<!doctype html>
<html class="no-js">
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<script src="js/modernizr.js"></script>
<style>
.reflejo{
font-size:5em;
font-family:Verdana, Geneva, sans-serif;
text-align:center;
-webkit-box-reflect:below -0em -webkit-linear-gradient(top, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 100%);
box-reflect:below -0em linear-gradient(top, rgba(255,255,255,0.6) 0%, rgba(255,255,255,0) 100%);
}
.no-cssreflections .reflejo{
color:red;
box-reflect:none;
text-shadow:10px 10px 10px black;
}
.no-js .reflejo{
color:green;
box-reflect:none;
text-shadow:10px 10px 10px black;
}

</style>
</head>

<body>
<p class="reflejo">Soy espejo y me reflejo</p>
</body>
</html>

No hay comentarios:

Publicar un comentario