0

その下の画像に関する情報を作成しようとしています。しかし、問題があります...疑似要素が表示されません..

<img info="hey guys" src="http://i024.radikal.ru/1211/4c/809c7c2dfa74.jpg">
<div info="I'm working, but I'm inside the block"></div>

div {
    height: 100px;
    margin: 10px;
    background: yellow;
}
div[info]::after, img[info]::after {
    content: attr(info);
    display: block;
    margin: 3px;
    color: black;
    font-style: italic;
}

Jsfiddle DEMO

ありがとう。

4

2 に答える 2

2

img要素は子を持つことができないため、疑似要素を持つことはできません — <code>::before が要素内に挿入されます。次のようになります。

<img><before></img>

または、少なくとも仕様で定義されていません

この仕様は、:before および :after と置き換えられた要素 (HTML の IMG など) との相互作用を完全には定義していません。これは、将来の仕様でより詳細に定義されます。

于 2012-11-25T16:43:50.737 に答える
1

疑似要素は、要素のコンテンツに追加/先頭に追加されます。an <img>(および<input>たとえば an) にはコンテンツがないため、疑似要素を適用することはできません。

于 2012-11-25T16:44:02.493 に答える