css打开三维盒子立体动画效果代码

代码语言:html

所属分类:动画

代码描述:css打开三维盒子立体动画效果代码

代码标签: css 盒子 立体 打开

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/prefixfree.js"></script>
<style>
    html,body {
	height:100%;
}
body {
	margin:0;
	overflow:hidden;
	background:radial-gradient(circle,#444857,#2d303a);
	color:#b8bbc8;
	font-family:'Lato','Lucida Grande','Lucida Sans Unicode',Tahoma,Sans-Serif;
	font-weight:400;
	font-size:15px;
}
.container {
	position:absolute;
	top:50%;
	left:50%;
	font-size:40px;
	transform-style:preserve-3d;
}
.fox {
	position:absolute;
	top:50%;
	left:50%;
	transform-style:preserve-3d;
	transform:rotateX(-35deg) rotateY(-45deg) scale3d(0.3,0.3,0.3);
	animation:fox 6.6s infinite ease-in-out both;
}
.fox .rot {
	position:absolute;
	top:50%;
	left:50%;
	transform-style:preserve-3d;
	animation:rot 6.6s infinite both;
}
.fox .side.........完整代码请登录后点击上方下载按钮下载查看

网友评论0