css - 如何在 CSS 中添加多个图像？

Question

您好，我是 CSS 的新手，目前我在标题中只使用了一张图片，您可以在此处看到:

#header {
    position: relative;
    background-image: url("../../images/header.jpg");
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    color: #fff;
    text-align: center;
    padding: 7.5em 0 2em 0;
    cursor: default;
}

如何在同一页眉中添加更多图片，且仅在同一页眉中添加过渡效果？我不想更改 header 的 html 中的命名法，而是想通过 CSS 控制图像

Answer 1

您可以使用 :after 和 :before 叠加额外的两层，并使用 @keyframes 和 animation 过渡这些层 最多可组成三个渐变背景，

否则，在不使用额外的子 HTML 的情况下，仅在 header 中是不可能的...