將title/alt屬性放入CSS中：after {content：image}？

Question

我有以下的CSS的PDF圖標添加到鏈接到一個PDF的任何鏈接：

a.pdf-link:after { padding-left: 2px; content: url(../images/icon-pdf-link.gif);} 

是否有可能把一些標題和在該圖像上的ALT屬性？我喜歡它，這樣用戶就可以將鼠標懸停在圖標上並獲得一些文本，如「此鏈接指向.pdf文件」。我通常只通過將標題屬性添加到該文件中，但無法弄清楚如果我可以通過這種方法做到這一點。

Answer 1

不，content只接受原始文本和圖像數據，而不接受HTML。

您需要使用JavaScript動態地將工具提示添加到現有的HTML元素。

至於該圖標，你可以使用一個背景圖片和一些填充：

a.pdf-link { 
    padding-left: 2px; 
    padding-right: 20px; 
    background: url(../images/icon-pdf-link.gif) right center no-repeat; 
} 

如果您需要專門有一個提示只是在圖標上，不過，你需要在JavaScript中做的一切作爲評論說。

Answer 2

基於答案我只是做與jQuery如下：

$(".pdf-link").before("<img src='../images/icon-pdf-link.gif' title='This link is a pdf' />");