img
要素は置換要素なので、現在の安定仕様では明記されてはいないものの歴史的な事情により::before
/::after
擬似要素による挿入は行えない。しかしChrome 41で遊んだところ、src
属性がない場合は挿入することができるようだ。Internet Explorer 11やFirefox 36、Mobile Safari 8では行えない。
Demo: img element w/o src attribute and pseudo element
Chrome 41ではalt
属性の値である“img without src”という文字列の前に::before
擬似要素で仕込んだ“pseudo element for img!”という文字列が挿入されていることがわかる。Chrome 43でも同様だった。
src
属性がないとimg
要素がパース・エラーで不明な要素にでもなるのかなと想像したが、alt
属性がちゃんと展開されているのでそうではなさそうだ。alt
属性が展開されるようなケースが特別扱いされているということなのだろうか。
イシューを立てようかと思ったのだけど、仕様上は挿入してはならないことにはなっておらず、立てづらかったため保留した。CSS 2.1では「将来的には決めるつもりだけど、まだ決まってない」となっている。それを決めるはずのCSS3 Generated and Replaced Content ModuleのReplaced contentの項では::outside::before
等を使えということになっているが2003年のWorking Draftで根拠にはしづらい。
意図的に行わないと再現しそうにないため、誤爆するということもなさそうなので、ここに記録するに留めておこう。