Kandil Bayram mesajları için divbox

Başlatan snrj, 14 Nis 2018 17:43

« önceki - sonraki »

0 Üyeler ve 2 Ziyaretçiler konuyu incelemekte.

*

  1. 3,263

  2. 596

  3. 1077

sitemizde miraç kandilinde kullandığımız divbox

temanızın index.template.php de uygun gördüğünüz yere ekleyin
<div class="kandil shake">Yüreklerimiz ibadetle çarpsın, gönüllerimiz bir olsun. Miraç Kandiliniz mübarek olsun...</div>
index.css de en alta ekleyin
@-webkit-keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {
  0%, 100% {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%, 30%, 50%, 70%, 90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    -ms-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%, 40%, 60%, 80% {
    -webkit-transform: translate3d(10px, 0, 0);
    -ms-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
   animation-duration: 1.5s;  
   -webkit-animation-duration: 1.5s;

   animation-timing-function: ease-in-out;  
   -webkit-animation-timing-function: ease-in-out;      

}
.kandil{     color: #5a5a5a;
    font-size: 20px;
    font-weight: 600;
    background-color: #ffc107;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.19);
    border: 1px solid rgba(0, 0, 0, .1);
    box-shadow: 0 3px 5px rgba(0, 0, 0, .15), inset 0 1px 0 rgba(255, 255, 255, 0.3);
    position: relative;
    padding: 20px 1%;
    clear: both;
    border-radius: 6px;    text-align: center;
background-image:url(https://cdn6.aptoide.com/imgs/d/d/4/dd429775ced79570cd36ae1509b64e3e_icon.png?w=124);
background-size: 6% 100%;
    background-repeat: no-repeat;
    background-position: 3% 0%;
margin:10px 0;
}

*

  1. 1,198

  2. 120

  3. 401
Elinize Sağlık abi Paylaşım için Teşekkürler


Benzer Konular (3)


MENU ×