css - CSS画像の遷移

Question

複数の画像を重ねたり、srcとbackgroundの組み合わせを使用したりするなど、オンラインで見つけたハックを発生させずに、CSSに画像のsrcの変更を認識させ、正しい遷移を適用させることは本当に不可能ですか？

画像はウェブサイトの主要な要素（div、画像、テキスト）の1つであるため、このような欠陥のようです。私の質問は：それは本当に直接サポートされていないのですか、そうでない場合はなぜですか？

Answer 1

可能です。特定の属性の特定の値によって要素を照合する CSS ルールを作成できます。これは CSS セレクターでめったに使用されない機能ですが、CSS 2.1 以降でサポートされており、私も 1 回使用したことがあります。IE7 を含むすべてのブラウザーで動作します。詳細については、http ://www.w3.org/TR/CSS2/selector.html#attribute-selectors を参照してください。

例：

img[src='one.png'] { ... }
img[src='two.png'] { ... }

ライブデモ: http://jsfiddle.net/dJJqf/

Answer 2

CSS は DOM を変更できません。いいえ、src 属性を編集することはできません。

もちろん、JavaScript を使用するか、background-imageCSS から変更できる CSS 背景 ( ) を使用できます。

または、HTML で多くの<img>タグを使用してから、CSS を使用してこれらを移動します。