如何製作像Facebook的視頻縮略圖[CSS]

Question

我期待在Facebook上製作視頻縮略圖，但我無法通過縮略圖像Facebook上那樣獲得播放按鈕。

CODE

HTML

<a href="watch-video.php?c=1244"> 
    <img src="http://img.youtube.com/vi/X0OdLlX-cIw/1.jpg"> 
    <b></b> 
</a> 

CSS

.wall_video a {display: block; width: 128px; height: 96px; padding: 4px; border: 1px solid #cccccc; position: relative} 
.wall_video a img {display: block; width: 128px; height: 96px; } 
.wall_video a b {background: url(images/play-icon.png) no-repeat; display: block; width: 28px; height: 30px; position: absolute;} 

當我嘗試浮動img時，按鈕位於最上方。起初，我認爲它的立場：相對和負的頂部利潤率，但是當我檢查Facebook的來源時，他們不使用相對定位。

Answer 1

.wall_video a b { 
    /* ... */ 
    position: absolute; 
    left: 5px; 
    bottom: 5px; 
}