CSS transform animasyon

<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <style> #kutu-1 { margin: 50px; border: 5px ridge pink; width: 250px; height: 150px; background-color: yellow; color: black; -webkit-animation: animasyonismi 4s infinite; animation: animasyonismi 4s infinite; text-align:center; } @-webkit-keyframes animasyonismi { 50% {-webkit-transform: rotate(180deg);} } @keyframes animasyonismi { 50% {transform: rotate(180deg);} } </style> </head> <body> <strong>css transform animasyon örnek</strong> <br /> <p>Gradually rotate the DIV element 180 degrees, and back: <p> <div id="kutu-1"> <h2>HTML Dersleri <br />CSS Dersleri <br />Javascript Dersleri</h2> </div> <em style="color:red;">css transform </em>özelliğini bir html elemanını sayfanın üstüne veya yukarındaki elemente göre konumlandırırken kullanılır.. <br /> <u style="color:blue;"> css transform</u> özelliğinin animasyon özelliği vardır. <p style="color:green;"><b>Hatırlatma:</b> internet explorer 9 ve önceki versiyonları CSS animasyon özellikleri desteklemez !</p> </body> </html>

Yorumlar

Bu blogdaki popüler yayınlar

HTML Resimler

HTML yorum etiketi ile öğe gizleme örneği

Eski tarayıcılarda kod gizleme ve kod satırını bölme Javascript

HTML5 Canvas Oyun Yapımı Dersleri

YouTube Reklam Engelleyici

javascript ile aciklama satiri ve haftanın gunünü bulma

Linklerin Renklerini Değiştirme Örnek