<!doctype html>
<html><head><meta charset="utf-8"><title>旋转的球体</title><style type="text/css">/* 动画定义 */@keyframes spin {
from { transform: rotate(0deg);}to { transform: rotate(360deg);}}@-webkit-keyframes spin { from { transform: rotate(0deg);}to { transform: rotate(360deg);}}/* 旋转，渐变色 */#advanced { width: 200px; height: 200px; background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%); background-image: -webkit-radial-gradient(45px 45px, circle cover, yellow, orange); background-image: radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%); animation:spin 2s cubic-bezier(0.9,1,0.2,1) infinite; -webkit-animation:spin 2s cubic-bezier(0.9,1,0.2,1) infinite; border-radius:50%;}</style></head><body>
<div id="advanced"></div></body></html>