css - CSS图像过渡

Question

是否真的不可能让 CSS 识别图像 src 的变化并应用正确的过渡，而不会导致我在网上找到的 hack，例如将多个图像相互叠加或使用 src 和背景的组合？

这似乎是一种缺陷，因为图像是任何网站的主要元素之一（div、图像、文本）。我的问题是：真的不直接支持吗，如果不支持，为什么？

Answer 1

有可能的。您可以创建 CSS 规则以通过某些属性的某些值来匹配元素。这是 CSS 选择器中很少使用的功能，但自 CSS 2.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-image可以从 CSS 更改的 CSS 背景 ( )。

或者，在 HTML 中使用大量<img>标签，然后使用 CSS 来移动这些标签。