CSS3 3d旋转效果
<style type="text/css">
bodys{
font-family:Microsoft YaHei,"微软雅黑",Lucida,Verdana,Hiragino Sans GB,STHeiti,WenQuanYi Micro Hei,Droid Sans Fallback,SimSun,sans-serif;
animation: fade 3s;
-moz-animation: fade 3s; /* Firefox */
-webkit-animation: fade 3s; /* Safari 和 Chrome */
-o-animation: fade 3s;
}
body{
animation: flipper 3s ease-in;
-moz-animation: flipper 3s ease-in;
-webkit-animation: flipper 3s ease-in;
transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;}
@-webkit-keyframes flipper{
0%{-webkit-transform:perspective(2500px) rotateY(0deg)}
15%,100%{-webkit-transform:perspective(2500px) rotateY(360deg)}}
@-moz-keyframes flipper{0%{-moz-transform:perspective(2500px) rotateY(0deg)}15%,
100%{-moz-transform:perspective(2500px) rotateY(360deg)}}
@keyframes flipper{0%{transform:perspective(2500px) rotateY(0deg)}15%,
100%{transform:perspective(2500px) rotateY(360deg)}}
#blogCalendar{
font-family: digit,cnword;
}
</style>
<body>
<a name="top"></a>
<!--done-->
<div id="home">
<div id="header">
<div id="blogTitle">
<a id="lnkBlogLogo" href=" /"><img id="blogLogo" src="csdn.gif" alt="返回主页" /></a>
<!--done-->
<h1><a id="Header1_HeaderTitle" class="headermaintitle" href="/">CSDN</a></h1>
<h2>全球最大中文IT社区,为IT专业技术人员提供最全面的信息传播和服务平台</h2>
</body>
试下吧小伙伴