<meta charset="utf-8"/>
<style>
* {margin: 0; padding: 0;}
ul {
height: 80px;
background: #30C2A5;
width: 290px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
li {
list-style: none;
float: left;
margin-left: 5px;
font: 30px/80px arial;
color: #fff;
animation: one 2s infinite;
}
li:nth-child(1){animation-delay:0.1s;}
li:nth-child(2){animation-delay:0.2s;}
li:nth-child(3){animation-delay:0.3s;}
@keyframes one{
0%{transform:rotateY(0)}
100%{transform:rotateY(360deg)}
}
</style>
<ul>
<li>大</li>
<li>家</li>
<li>好</li>
</ul>