旋转（360deg）圆圈内的文字选框动画

Question

我只想问是否可以在div内使用旋转文字？

<style> 
div{ 
    -moz-border-radius: 50px/50px; 
    -webkit-border-radius: 50px 50px; 
    border-radius: 80px/80px;; 
    border:solid 21px #f00; 
    width:100px; 
    height:100px; 
} 
</style> 

<div>this will rotate 360 deg like marquee</div> 

感谢

Answer 1

退房this fiddle。你必须正确地对准你的文字，但（这将取决于你的布局的通用方法。）

CSS：

div{ 
    -moz-border-radius: 50px/50px; 
    -webkit-border-radius: 50px 50px; 
    border-radius: 80px/80px;; 
    border:solid 21px #f00; 
    width:100px; 
    height:100px; 
    -webkit-animation: rotation 2s linear infinite; 
    -moz-animation: rotation 2s linear infinite; 
    -ms-animation: rotation 2s linear infinite; 
} 

@-webkit-keyframes rotation { 
    0% { -webkit-transform: rotate(0deg); } 
    100% { -webkit-transform: rotate(360deg); } 
} 
@-moz-keyframes rotation { 
    0% { -moz-transform: rotate(0deg); } 
    100% { -moz-transform: rotate(360deg); } 
} 
@-ms-keyframes rotation { 
    0% { -ms-transform: rotate(0deg); } 
    100% { -ms-transform: rotate(360deg); } 
}