Lab : DegradadoLinear.html

<!doctype html>
<html>
	<head>
		
		<style type="text/css">
			.Caja { 
				float:left;
				width:200px;
				height:200px;
				margin-right:20px;
				border-radius:4px;
				border:1px solid #999;
			}
			
			.EjemploLinearSimple {
				background:-webkit-linear-gradient(rgb(255, 0, 0), rgb(100, 0, 0));
				background:-moz-linear-gradient(rgb(255, 0, 0), rgb(100, 0, 0));
				background:-o-linear-gradient(rgb(255, 0, 0), rgb(100, 0, 0));
				background:linear-gradient(rgb(255, 0, 0), rgb(100, 0, 0));
			 }
			 
			.EjemploLinear3C {
				background:-webkit-linear-gradient(45deg, rgb(255, 255, 0) 20%, rgb(200, 0, 0) 60%, rgb(0, 150, 0));
				background:-moz-linear-gradient(45deg, rgb(255, 255, 0) 20%, rgb(200, 0, 0) 60%, rgb(0, 150, 0));
				background:-o-linear-gradient(45deg, rgb(255, 255, 0) 20%, rgb(200, 0, 0) 60%, rgb(0, 150, 0));
				background:linear-gradient(45deg, rgb(255, 255, 0) 20%, rgb(200, 0, 0) 60%, rgb(0, 150, 0));
			}		
		</style>
	</head>
	<body>
    	<p>Este ejemplo no funciona en IE9 e inferiores!</p>
    	<div class='Caja EjemploLinearSimple'></div>
    	<div class='Caja EjemploLinear3C'></div>
	</body>
</html>

Actualización en 5s
Esc para cancelar
Alt+A para actualizar

Usuario
Password