<html>
<style>
body{
background-color: navy;
}
#caja{
width: 190px;
height: 250px;
background-color: navy;
margin: auto;
}
.pixel{
width: 10px;
height: 10px;
float: left;
-webkit-animation: color 1.2s infinite alternate;
-moz-animation: color 1.2s infinite alternate;
animation: color 1.2s infinite alternate;
}
@-webkit-keyframes color{
0%{-webkit-transform: scale(2.2) rotate(720deg);}
}
@-moz-keyframes color{
0%{-moz-transform: scale(2.2) rotate(720deg);}
}
@keyframes color{
0%{transform: scale(2.2) rotate(720deg);}
}
#contorno{background-color: black;}
#verdeuno{background-color: yellowgreen;}
#verdedos{background-color: darkgreen;}
#amarillo{background-color: yellow;}
#rosa{background-color: pink;}
#roml{background-color: orange;}
#onix{background-color: white;}
#cafe{background-color: brown;}
</style>
<div id="caja">
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div>
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel"id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div> <!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="roml"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><!--roml-->
<div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><!--roml-->
<div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="roml"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="onix"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="onix"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="rosa"></div><div class="pixel" id="rosa"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="amarillo"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdedos"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="cafe"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="cafe"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="cafe"></div><div class="pixel" id="cafe"></div><div class="pixel" id="cafe"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="cafe"></div><div class="pixel" id="cafe"></div><div class="pixel" id="cafe"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel" id="contorno"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div>
<div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><div class="pixel"></div><!--roml-->
<div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div><div class="pixel" id="verdeuno"></div>
</div>
</html>
2 Responses
Write a comment
You can use [html][/html], [css][/css], [php][/php] and more to embed the code. Urls are automatically hyperlinked. Line breaks and paragraphs are automatically generated.