無法獲得背景圖像顯示在這個小提琴

Question

我試圖實踐我的jQuery和JavaScript。當用戶點擊arrow.png時，我正在研究一個旋轉備註的小提琴。但由於某種原因，它沒有顯示，我不能測試我的代碼大聲笑...我要添加CSS動畫，以及讓它旋轉，而不是使用JavaScript。這裏是小提琴http://jsfiddle.net/wrkmH/6/。我的CSS沒有顯示出什麼問題？我知道這是一個非常低調的問題，對不起，我無法弄清楚。 的HTML：

<p>I'm a <span id="remark">nice guy </span>. 
    <a href="#" id="spinner" class ="anim"></a> 
</p> 

的CSS：

#spinner { 
    height: 30px; 
    background-image:url('http://i.imgur.com/bfhwPv9.png'); 
    background-repeat:no-repeat; 
    display: inline-block;  
} 

Answer 1

只是下面的一個替代你的CSS，

#spinner { 
    height: 200px; 
    width: 200px; 
    background-image:url('http://i.imgur.com/bfhwPv9.png'); 
    background-repeat:no-repeat; 
    display: inline-block;  
} 

這將解決您的問題。 保持編碼:)

Answer 2

你加載圖像 「http://i.imgur.com/bfhwPv9.png」 是200像素X 200像素。您目前只將高度設置爲30px。如果設置#spinner將圖像尺寸：

#spinner { 
    height: 200px; 
    width: 200px; 
    background-image:url('http://i.imgur.com/bfhwPv9.png'); 
    background-repeat:no-repeat; 
    display: inline-block;  
} 

您可以看到微調：demo fiddle

Answer 3

試試這個

#spinner { 
    height: 200px; 
    background-image:url('http://i.imgur.com/bfhwPv9.png'); 
    background-repeat:no-repeat; 
    display: block;  
}