gpt4 book ai didi

html - 背景大小卡在超过 100% 的值上?

转载 作者:行者123 更新时间:2023-11-28 07:16:36 26 4
gpt4 key购买 nike

试图弄清楚这里发生了什么。在 http://www.gradient-animator.com/ 上看到了一个非常酷的如何进行背景转换的示例

但是,当我将它们插入我的测试站点时,背景保持稳定并且不会进行转换,直到您在开发人员控制台中禁用 background-size 属性,然后重新启用它。

我只是为了我的生活,无法弄清楚出了什么问题......

@-webkit-keyframes gbpr {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@-moz-keyframes gbpr {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
@keyframes gbpr {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
.container {
height: 100%;
width: 100%;
}
body,
html {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
}
.container {
background: linear-gradient(270deg, #0ae6ae, #2d80f3, #bd2df3, #f32d57);
background-size: 800% 800%;

-webkit-animation: gbpr 30s ease infinite;
-moz-animation: gbpr 30s ease infinite;
animation: gbpr 30s ease infinite;
}
<div class="container">

</div>

最佳答案

如果在线性渐变中包含 !important,动画将无法移动它。就那么简单。

关于html - 背景大小卡在超过 100% 的值上?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32318177/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com