html - 您能否在保持子内容可见的同时淡入背景图像？

Question

所以我有一个 <header>带有 <h1> 的标签里面的标签。 <header>标记有一个 CSS 背景图像，我想使用 CSS 或 jQuery 慢慢淡入。

<header>
    <h1>Title</h1>
</header>

这是否可能在整个 <header> 中不褪色？标签(它也会在 <h1> 标签中淡出？我不想以任何方式修改 HTML。

Answer 1

子元素继承父元素的不透明度。

如果您的背景是颜色，您可以为 background-color 属性设置动画。

如果不是颜色，您可以将子元素移到动画元素之外，然后使用 CSS 进行定位，使它们看起来像子元素(或与您的设计匹配的任何元素)。