css圖檔上面加文字透明,CSS實作文字半透明顯示在圖檔上方法

文字顯示在圖檔上

*{border:none;text-decoration:none}

.wrap{margin:8px;position:relative}

.photo a{position:absolute;display:block;border:1px solid #555555;}

.photo a:hover{border:1px solid #FFFFFF;}

.photo span{width:633px;background:#000;display:block;position:absolute;bottom:0;left:0;color:#fff;filter:alpha(opacity=50);-moz-opacity:0.6;opacity:0.6;font:bold 12px/30px Verdana, Arial; text-align:center;cursor:hand;display:none;}

.photo a:hover span{text-decoration:underline;display:block;}

标題層疊在圖檔上，标題文字和背景半透明但是不顯示。滑鼠經過邊框換色并且顯示标題。