img元素的content属性

Question

在检查Chrome Dev工具时,我注意到以下CSS片段:

img {
    content: url(image-src.png);
}

在Chrome中完美运行(见下面的截图).

这允许我通过CSS定义<img>标签的src属性.在Firefox中不起作用.到目前为止,我认为不可能通过css直接修改src属性,我没有找到任何人谈论这个.那么,这只是Chrome中的一个专有添加,还是Chrome实施W3C草案或类似我不知道的东西？

Answer 1

contentCSS 2.1中定义的属性仅适用于:before和:after伪元素.通过CSS规则,您可以为任何元素指定任何属性,但规范对"适用于"(即对各种元素产生影响)的属性有限制.

的生成和替换内容模块CSS3,一个工作草案,描述了content属性为适用于所有元素.它有一个用h1图像替换元素内容的例子,当然可以对一个img元素做同样的事情.

但这只是一份工作草案.关于CSS实现状态的常用资源,QuirksMode.org CSS信息和Caniuse.com,并未说明情况; 他们只描述对contentfor :before和for 的支持:after(除IE 7及更早版本外,它是相当普遍的.