2

<img>要素を (他のマークアップなしで) 取得し、背景色とストロークを持つ要素として表示しながら、画像のピクセル コンテンツを非表示にする CSS ハック/テクニックはありますか?

たとえば<img src="foo.jpg">、ページ上の を 32x32 の無地のバッジにします。

私はブラウザ固有のハック (Webkit にはソリッド フィル効果がありますか?) または CSS3 の素晴らしいソース (ありimage-content-opacity:0.0ますか?) に興味がありますが、IE8+、FF4+ などで動作するソリューションが必要です。

この質問の動機に興味がある場合は、このページの編集履歴を参照してください。この質問に答えるのではなく、問題を解決するための回避策を見つけようとすることにユーザーの注意をそらしていたため、削除されました。

4

2 に答える 2

1

画像を非表示にし、無地で塗りつぶされた背景を使用します。
ここの例http://jsfiddle.net/notme/ZUvHN/6/

于 2012-06-05T00:09:18.330 に答える
1

これは、上記の私のコメントと notme の解決策の抜粋です。

http://jsfiddle.net/ZUvHN/7/

私がしたことは、から削除display:table-cellしてからaに設定することでしたdisplay: block

次に、をに設定imgしますdisplay: none

これにより、境界線と背景のスタイルをaタグではなくタグに適用できますimg。余白と間隔を少し調整する必要があるでしょう。

オプションがあるかどうかはわかりませんが、JavaScript を使用して HTML を少し調整する方が簡単かもしれません。

于 2012-06-05T16:49:45.223 に答える