gpt4 book ai didi

html - 背景并不总是适用于 body

转载 作者:太空宇宙 更新时间:2023-11-04 09:44:23 24 4
gpt4 key购买 nike

我遇到了一个我不太清楚的可能的 css/浏览器错误。简而言之,我设置了以下场景:

.my-class {
background: #66c28f; /* Old browsers */
background: -moz-linear-gradient(left, #66c28f 0%, #0e9498 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #66c28f 0%,#0e9498 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #66c28f 0%,#0e9498 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66c28f', endColorstr='#0e9498',GradientType=1 ); /* IE6-9 */
}
<body class="my-class">
</body>

如您所见,添加了多个背景属性是为了向后兼容。问题是,当我定义了多个背景时,有时什么也没有显示出来。我会说每 3 次加载页面中就有 1 次背景不显示。这似乎是全有或全无。但是,第二次我调整页面大小,或选择主体并在开发人员工具中打开和关闭背景颜色时,颜色会立即显示(是的,样式在开发人员工具中显示为正常工作 - 请参见下面的屏幕截图)。我在测试中使用的是最新的稳定版 Chrome。

我相当肯定这不是 body 没有 100% 高度或类似情况的问题。样式表也是 head 部分中的最后一个样式表。当我删除除一个背景属性以外的所有属性时,它在 100% 的时间内都有效。

知道为什么这会在现代浏览器中发生吗?我不能提供后备背景样式吗?

下面的屏幕截图显示了当背景显示时开发人员工具的结果(但似乎在开发工具中正常工作)。

enter image description here

注意:这似乎与 2009 年的帖子类似,但没有给出解释:background color doesn't always show up

最佳答案

有一次我对此有疑问,但尝试给出 height:100%给你的<body><html>或者有时试试 min-height:100%给你的<body> .在这种情况下,请使用以下 css 代码重试:

html, .my-class {
height: 100%;
background: #66c28f; /* Old browsers */
background: -moz-linear-gradient(left, #66c28f 0%, #0e9498 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #66c28f 0%,#0e9498 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #66c28f 0%,#0e9498 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66c28f', endColorstr='#0e9498',GradientType=1 ); /* IE6-9 */
}

检查这个question了解更多关于这个问题。

关于html - 背景并不总是适用于 body ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39604517/

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