css·div浮游与切图（Vue）

/* 浮动 top: 0=0px; 是原div位置 */ 
position: absolute; 
top: 0=0px; 
right: 20px;

<template>
	<div id="app">
		<div class="Go">GO</div>
		
		<div class="divfloat animations">
			√√√√√
		</div>
	</div>
</template>

.Go {
		width: 30px;
		height: 20px;
		background-color: #FD8008;
		border-radius: 20px;
	}
	/* 浮游 漂浮设置 */
	.divfloat {
		width: 70px;
		height: 50px;
		background-color: #fd6fcf;
		border-radius: 20px;
		
		/* 漂浮设置 */
		position: fixed;
		left: 10%;
		top: 10%;
	}
	.animations{
		/* 定义动画 */
		animation: name 6000ms;
		
	}
	/* 设计动画 */
	@keyframes name{
		10% {
			background-color: blue;
		}
		20%{
			background-color: aquamarine;
			color: aliceblue;
		}
		30%{
			background-color: #2C3E50;
			color: aliceblue;
		}
		50%{
			background-color: #fc0107;
			color: aliceblue;
			/* 横向移动 */
			transform: translate(200px);
		}
		100%{
			background-color: #fd8008;
			color: aliceblue;
			/* 旋转 */
			transform: rotate(720deg);
		}
	}