css - 几秒钟后更改一次背景颜色

Question

是否可以更改 <p> 的背景颜色元素在几秒后(10 到 20 秒)使用 css fiddle ？我不想使用 js。

<p style="background:#E1FEE0;">Human</p>

Answer 1

使用 CSS 动画，您可以从 99.9% 跳到 100%。只需将初始背景颜色 (#E1FEE0) 设置在 99.9% 范围内，然后将最终背景颜色设置在 100% 范围内。如果您希望颜色过渡，只需增加间隙并为 example 使用类似 80% 的值.

Example Here

p {
    display: inline;
    animation: background-fade 10s forwards;
}

@keyframes background-fade {
    99.9% {
        background:#E1FEE0;
    }
    100% {
        background:#000;
    }
}

为简单起见，省略了其他供应商前缀。