将title/alt属性放入CSS:{content:image}之后?

Sve*_*ang 9 css title pseudo-element alt

我有以下CSS将PDF图标添加到链接到PDF的任何链接:

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

是否可以在此图像上添加一些title和alt属性?我希望它能让用户将鼠标悬停在图标上并获得一些文本,例如"这链接到.pdf文件."我通常只是将标题属性添加到其中,但无法弄清楚如果我能通过这种方法做到这一点.

Bol*_*ock 6

不,content只接受原始文本和图像数据,而不接受HTML.

您需要使用JavaScript动态地向现有HTML元素添加工具提示.

至于图标,您可以使用背景图像和一些填充:

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

但是,如果您只需要在图标上专门提供工具提示,则需要按照评论的说法在JavaScript中执行所有操作.