10

PDFにリンクするリンクにPDFアイコンを追加するための次のCSSがあります。

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

この画像にタイトルと代替属性を付けることは可能ですか？ユーザーがアイコンにカーソルを合わせて、「これは.pdfファイルにリンクしています」のようなテキストを取得できるようにしたいと思います。これは通常、タイトル属性を設定するだけで実行できますが、このメソッドで実行できるかどうかはわかりません。

4

3 に答える 3

7

いいえ、contentHTML ではなく、未加工のテキストと画像データのみを受け入れます。

ツールチップを既存の HTML 要素に動的に追加するには、JavaScript を使用する必要があります。

アイコンに関しては、背景画像といくつかのパディングを使用できます。

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

ただし、特にアイコンにのみツールチップを表示する必要がある場合は、コメントにあるように JavaScript ですべてを行う必要があります。

于 2011-05-10T01:31:43.640 に答える
0

答えに基づいて、jQueryで次のことを行いました：

$(".pdf-link").before("<img src='../images/icon-pdf-link.gif' title='This link is a pdf' />");
于 2013-09-05T19:36:18.860 に答える