参见英文答案 >
Does :before not work on img elements?6个
我试过这个,它运行正常
我试过这个,它运行正常
<p alt="world">hello</p>
用CSS
p::after {
content: attr(alt);
}
但是当我尝试时它不起作用
<img src="http://placehold.it/300x300" alt="my image caption">
用CSS
img::after {
content: attr(alt);
}
请指出浏览器与您提供的任何解决方案兼容.
解决方法
这是设计的.
img标签是自动关闭(< tag />)标签,因此它们不包含“内容”.由于它们不包含任何内容,因此不能附加任何内容(即:: after)或prepended(即:: before).
<area>,<base>,<br>,<col>,<command>,<embed>,<hr>,<keygen>,
<link>,<Meta>,<param>,<source>,<track>and<wbr>
这是(CSS2)规范所说的：
Note. This specification does not fully define the interaction of
:before and :after with replaced elements (such as IMG in HTML). This
will be defined in more detail in a future specification. [2014: hasn’t happened yet]
资料来源：http://www.w3.org/TR/CSS2/generate.html#before-after-content
