CSS3 İle Neon Yazı Efekti

0 yorum


neon-yazi
CSS3 animasyon efektleri candır. Kullanın kullandırın! :)


Html Kodu
<h1 class="neon"><span class="in">Bil</span><span class="out">gi</span> <span class="in">B</span><span class="out">log</span</h1>
CSS  Kodu
@-moz-keyframes neonglow {
20%, 70% {
color: #fff;
text-shadow: none;
}
25%, 50%, 75%, 95% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
55% {
color: #fff;
text-shadow: none;
}
}
@-moz-keyframes ontheblink {
21%, 39%, 45%, 47%, 53% {
color: #fff;
text-shadow: none;
}
26%, 38%, 40%, 44%, 46%, 48% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
}
@-ms-keyframes neonglow {
20%, 70% {
color: #fff;
text-shadow: none;
}
25%, 50%, 75%, 95% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
55% {
color: #fff;
text-shadow: none;
}
}
@-ms-keyframes ontheblink {
21%, 39%, 45%, 47%, 53% {
color: #fff;
text-shadow: none;
}
26%, 38%, 40%, 44%, 46%, 48% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
}
@-webkit-keyframes neonglow {
20%, 70% {
color: #fff;
text-shadow: none;
}
25%, 50%, 75%, 95% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
55% {
color: #fff;
text-shadow: none;
}
}
@-webkit-keyframes ontheblink {
21%, 39%, 45%, 47%, 53% {
color: #fff;
text-shadow: none;
}
26%, 38%, 40%, 44%, 46%, 48% {
color: #fff;
text-shadow: 0 0 10px #fff, 0 0 20px #fe05fb, 0 0 30px #fe05fb;
}
}

.in {

-moz-animation: neonglow 10s infinite;
-ms-animation: neonglow 10s infinite;
-webkit-animation: neonglow 10s infinite;
color: #000;
}
.out {
-moz-animation: ontheblink 10s infinite;
-ms-animation: ontheblink 10s infinite;
-webkit-animation: ontheblink 10s infinite;
}
Demo İçin Tıkla
Bu Bilgiyi Paylaş :

Yorum Gönder

Sitemizde sizlere ilginç gelebileceğine inandığımız her konuda yazılar ve bilgiler paylaşıyoruz. Sitemizde bulabilecekleriniz şöyle:Otomobil,sağlık,blog,haber,backlink,site ekle,banner ekle,html kodlar,dizi,film,ilginç bloglar,blogger için temalar,internet için bilgiler,siyasi görüşler,anketler,yazılımlar,ilginç siteler,ilginç insanlar,mesleklerle ilgili ayrıntılar,forumlar,fikir paylaşımları,yorumlar
 
Siteler: Oyun58 | Kadın Ve Yaşam | Dizi İzle
Copyright © 2011. Bilgi Blog - Tüm Hakları Saklıdır
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger