CSS letter-spacing animasyon

Aralık 09, 2015

htmlvecssegitimi.blogspot.com

Kodu Çalıştır butonuna tıklayarak HTML belgesini Sonuç Ekranı'nda görüntüleyebilirsiniz.

KAYNAK KODLARI	SONUÇ EKRANI
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <style> #kutu-1 { letter-spacing: 2px; -webkit-animation: animasyonismi 10s infinite; animation: animasyonismi 10s infinite; } @-webkit-keyframes animasyonismi { 50% {letter-spacing: 20px;} } @keyframes animasyonismi { 50% {letter-spacing: 20px;} } </style> </head> <body> <strong>css letter-spacing animasyon</strong> <div id="kutu-1"> Yazının harfler arasındaki uzaklıklar "2px" ten "20px"e çıkardık. Yazının harfler arasındaki uzaklıklar "2px" ten "20px"e çıkardık. Yazının harfler arasındaki uzaklıklar "2px" ten "20px"e çıkardık. </div> <p><mark>css letter-spacing</mark> özelliği yazı ve karakterlerin arasındaki uzaklığı düzenlemek için kullanılır.Bu örnekte letter-spacing değerini "2px"ten "20px"e çıkardık.<p> <em style="color:red;font-weight:bold;">css letter-spacing özelliğinin animasyon özelliği vardır.</em><br /> <strong> CSS Animasyonları</strong> Internet Explorer 9 ve önceki versiyonlarında çalışmıyor..</p> </body> </html>

KAYNAK KODLARI

SONUÇ EKRANI

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<style> 
#kutu-1 {

letter-spacing: 2px;
    -webkit-animation: animasyonismi 10s infinite; 
    animation: animasyonismi 10s infinite;
}

@-webkit-keyframes animasyonismi {
    50% {letter-spacing: 20px;}
}

@keyframes animasyonismi {
    50% {letter-spacing: 20px;}
}
</style>
</head>
<body>
<strong>css letter-spacing animasyon</strong>
<div id="kutu-1">
Yazının harfler arasındaki uzaklıklar  "2px" ten "20px"e çıkardık.
Yazının harfler arasındaki uzaklıklar  "2px" ten "20px"e çıkardık.
Yazının harfler arasındaki uzaklıklar  "2px" ten "20px"e çıkardık.

</div>
<p><mark>css letter-spacing</mark> özelliği yazı ve karakterlerin arasındaki uzaklığı düzenlemek için kullanılır.Bu örnekte letter-spacing değerini "2px"ten "20px"e çıkardık.<p>
<em style="color:red;font-weight:bold;">css letter-spacing özelliğinin animasyon özelliği vardır.</em><br />
<strong> CSS Animasyonları</strong> Internet Explorer 9 ve önceki versiyonlarında çalışmıyor..</p>
</body>
</html>

Bu Blogda Ara

Html5 , CSS3 ve Javascript Dersleri

CSS letter-spacing animasyon

htmlvecssegitimi.blogspot.com

HTML ve CSS Dersleri © 2015 HTMLveCSSegitimi.blogspot.com

Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

İnternetten Para Kazanmanın Yolları -İnternetten Para Kazandıran Siteler -İnternetten Nasıl Para Kazanılır

Html dersleri

HTML5 ile SEO Uyumlu İçerik Üret

Web Sitenizden Çok Para Kazanin

İnternetten hangi alanlarda para kazanılır?-İnternetten para kazanmanın yolları

Uyurken Bile Para Kazanmak İster misin

Html belgesi yapısını anlama uygulaması

YouTube reklamları nasıl engellenir

HTML Yorumlar

HTML html Etiketi