css+div实现三维盒子文字旋转动画效果代码-html代码-BFW代码库

css+div实现三维盒子文字旋转动画效果代码

代码语言：html

所属分类：三维

代码描述：css+div实现三维盒子文字旋转动画效果代码

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


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

<head>

  <meta charset="UTF-8">

  <link href='https://fonts.googleapis.com/css?family=Raleway:400,100,300,500,600,700,800,900' rel='stylesheet' type='text/css'>


  
  
<style>
html, body {
  height: 100%;
  overflow: hidden;
}

body {
  background: #640a0f;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.3), transparent), linear-gradient(rgba(255, 255, 255, 0.5) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.5) 1px, transparent 1px), linear-gradient(rgba(255, 255, 255, 0.3) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.3) 1px, transparent 1px), #640a0f;
  box-shadow: inset 0 0 10em rgba(0, 0, 0, 0.5), 0 0 1em rgba(0, 0, 0, 0.8);
  font-family: Raleway, sans-serif;
  font-weight: 100;
}

.container {
  perspective: 1000px;
  perspective-origin: 50% 50%;
  width: 80%;
  margin: 0 auto;
  padding: 15%;
}

.animate {
  animation: spinningH 6s infinite linear;
}

.cube {
  position: relative;
  margin: 0 auto;
  height: 360px;
  width: 360px;
  transition: transform 2s linear;
  transform-style: pres.........完整代码请登录后点击上方下载按钮下载查看