Heim >Web-Frontend >HTML-Tutorial >Chrome立体动画代码_html/css_WEB-ITnose
Chrome立体动画代码_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:24:571158Durchsuche
效果预览:http://hovertree.com/code/run/css/x8l6si70.html
请实用Chrome浏览器查看效果,手机上也可以.
代码如下:
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>CSS3正方形翻转动画 - 何问起</title> <meta charset="utf-8" /> <style>.hewenqicube--ani { -webkit-animation: rot 4s linear infinite; } @-webkit-keyframes rot { to { -webkit-transform: rotateY(-330deg) rotateX(370deg); } } .hewenqicube{border:darkgreen solid 2px;width:200px;height:200px;background-color:silver;}#hovertreecom{width:400px;margin:10px auto;} </style></head><body> <div id="hovertreecom"> <h2>CSS3正方形翻转动画 by 何问起</h2> <div class='hewenqicube hewenqicube--ani'> 正方形翻转动画，请使用Chrome浏览器 。 http://hovertree.com <a href="http://hovertree.com">何问起</a> </div> </div></body></html> 转自:http://hovertree.com/code/css/x8l6si70.htm
更多特效：
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：博客优化_html/css_WEB-ITnoseNächster Artikel：javascript实现网页定时跳转代码_html/css_WEB-ITnose