•  


    Te amo
    Con corazón y alma

    Para texto, imagen...
    Fuente

    HTML

    <div id="sq"> 
     <div class="circ1">Te amo</div> 
     <div class="circ2"><a href="http://tutorialgloriav.eklablog.com/" target="_blank"><img src="http://imagenes.gifmania.com.pr/Gifs-Animados-Amor/Animaciones-Corazones/Imagenes-Animadas-Corazones-Colores/corazon-colores16.gif" alt="" /></a></div> 
     <div class="circ3">Con coraz&oacute;n y alma</div> 
     </div> 



    CSS

    <style><!--.circ1{ 
     width:160px; 
        height:160px;    
        border-radius:120px; 
        background-color:rgb(255, 255, 255);       
        }
    .circ2{ 
        width:150px; 
        height:180px;       
        border-radius: 80px / 50px; 
        background-color:rgb(255, 255, 255);    
        } 
            
    .circ3{ 
        width:150px; 
        height:220px;    
        border-radius: 80px / 50px; 
        background-color:rgb(255, 255, 255);       
        }
    .circ1{    
        width:120px; 
        height:120px;    
        border-radius:120px; 
        background-color:rgb(255, 255, 255);    
             margin:20px 0 0 60px;    
        } 
    
    .circ2{ 
        width:150px; 
        height:80px;       
        border-radius: 80px / 50px; 
        background-color:rgb(255, 255, 255);    
             margin:-90px 0 0 80px; 
        } 
            
    .circ3{ 
        width:150px; 
        height:90px;    
        border-radius: 80px / 50px; 
        background-color:rgb(255, 255, 255);    
        margin:-90px 0 0 0px;    
        }
    @-webkit-keyframes animar{ 
         0%  { }  
          50% { -webkit-transform:translateX(700px) scale(1.2);} 
          100% {-webkit-transform:translateX(0px); } 
    }
    #sq{ 
        -webkit-animation-name: animar; 
        -webkit-animation-duration: 20s; 
        -webkit-animation-timing-function: lineal; 
        -webkit-animation-iteration-count:infinite; 
        opacity: 0.6; 
        margin:0; 
        position:absolute; 
    }
    #sq{ 
        -webkit-animation-name: animar; 
        -webkit-animation-duration: 20s; 
        -webkit-animation-timing-function: lineal; 
        -webkit-animation-iteration-count:infinite; 
        opacity: 0.6; 
        margin:0; 
        position:absolute; 
    } 
    
    #sq2{ 
        -webkit-animation-name: animar;
        }
     --></style>