CSS 中的 "color" 等样式元素如何应用于 img 等元素？

Question

我目前正在阅读一本关于HTML开发网站的书，我遇到了一个练习，要求我突出显示树形图中受样式规则影响的元素

div#intro{color: red;}

这是解决方案https://i.stack.imgur.com/615Fq.jpg的图像。我不太同意，因为我不认为你可以给一个img元素颜色是红色。是解决方案不正确，还是我对继承的理解不正确?

Answer 1

任何与图像相关的文本都将是红色的。例如，如果我不提供src，但提供alt文本…alt文本为红色

看这把小提琴

HTML

<div id="red">
    <img alt="This is my alternate text" />
</div>

CSS

#red {
    color: #F00;
}

Answer 2

image标签仍然会继承颜色，但是在绝大多数情况下它实际上不会做任何事情。我能想到的唯一实例，它实际上是可见的用户将是，如果你的图像没有找到，它显示所有的文本，而不是图像。在这种情况下，图像的所有文本将是红色的。

一个更好的例子可能是background-color，因为有更多的场景会有用。例如，你可以在你的图像周围填充，背景颜色将是可见的，或者如果你使用透明PNG，那么背景颜色将在应用到图像标签时在图像后面可见。