旋轉（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); } 
}