Linklerinize CSS3  ile Gökkuşağı Renk Efekti

Linklerin Önemi ve CSS3 Animasyonuyla Gökkuşağı Renk Efekti

Link, Türkçe anlamıyla İlişim ya da Bağlantı, internet sayfalarında kullanıcının başka bir web sayfasına ya da uygulamaya yönlendirilmesini sağlayan bir bağlantıdır. Bu bağlantılar, aynı websitesi üzerinde ya da başka bir websitesinde, farklı bir adreste bulunabilir. İnterneti gezerken linkleri kullanarak farklı sayfalara erişim sağlarız. Genellikle sitelerde linkler, mavi renkte ve altı çizili olarak görünür.

Aşağıda paylaşacağım CSS3 animasyon kodları sayesinde linklerinizin üzerine gelindiğinde gökkuşağı renklerine dönüşecektir. Bu CSS3 animasyonuyla hover efekti, sitenize renk katarken, kullanıcılara hoş bir etki sunar. Bu uyumlu eklenti tüm tarayıcılarda çalışır ve sitenizin görünümünü canlandırır.

Linklerinizi CSS3 Animasyonuyla Hover Bağlantı Gökkuşağı Renk Efekti ile renklendirmek, sitenizin daha etkileyici bir görünüm kazanmasını sağlar ve ziyaretçilerinizin dikkatini çeker.



Gökkuşağı Renk Efekti


Blogger için Hover Bağlantı Rengi Ekleme


  • Blogger panelinize giriş yapın
  • Şablon HTML'yi Düzenle
  • Ctrl+F yardımı ile ]]></b:skin> kodunu aratıp bulun.
  • Ve hemen üstüne aşağıdaki kodları kopyalayıp yapıştırın.

@keyframes MEFhovergokkusagi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}}
@-o-keyframes MEFhovergokkusagi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}}
@-ms-keyframes MEFhovergokkusagi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}}
@-moz-keyframes MEFhovergokkusagi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}}
@-webkit-keyframes MEFhovergokkusagi{0%{color:black;}19%{color:red;}25%{color:brown;}40%{color:blue;}55%{color:green;}70%{color:orange;}85%{color:magenta;}100%{color:black;}}
a:hover{
animation:MEFhovergokkusagi 4s infinite; /* Standart */
-o-animation:MEFhovergokkusagi 4s infinite; /* Opera */
-ms-animation:MEFhovergokkusagi 4s infinite; /* IE */
-moz-animation:MEFhovergokkusagi 4s infinite; /* Firefox */
-webkit-animation:MEFhovergokkusagi 4s infinite; /* Safari ve Chrome */
}

  • Şablonu Kaydet diyip çıkıyoruz. Bu kadar.

Hover Metin Link Gökkuşağı Etkisi için CSS3 animasyonu kullanır:

  • CSS3 animasyonunu Tüm tarayıcılar desteklemektedir.
  • Hala eski tarayıcıları kullanıyorsanız Mozilla Firefox gibi güçlü bir tarayıcıyı hemen indirin.
  • CSS3 animasyon kodunu kullanarak daha verimli ve özlü yapılmış, bu yüzden blog yükleme çok etkilenmez hale gelir.
  • Bloggerda gökkuşağı etkisi yaratmak, çeşitli renkler oluşturmak için CSS3 kodu kullanma kolay bi yöntemdir.
  • Blogcular için Yeni efektler (ek bir etki) çeşitliliğini geliştirmek için CSS3 animasyon kodunu kullanabilirler.
Yapamadığınız bir şey olursa "YORUM" kısmında belirtebilirsiniz. iyi bloglamalar...

Yorum Gönder

Lütfen yalnızca yazı ile ilgili yorumlar yazın. Yazının konusu dışında iletmek veya sormak istediğiniz bir şey varsa iletişim formunu kullanın. Ve lütfen yorumlara tıklanabilir link yazmayın!

Önceki Makale Sonraki Makale