gpt4 book ai didi

javascript - CSS 背景重复 : no-repeat; still repeating

转载 作者:行者123 更新时间:2023-11-30 08:45:39 28 4
gpt4 key购买 nike

我有...

    html, body {
background-size: contain;
background-repeat: no-repeat;
}

作为我的 CSS 和我的 HTML,我有

<html>
<head>
<title>Wut</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>

<body>
<div id="page">
</div>
<script type="text/javascript">
var imgCount = 3;
var dir = 'img/';
var randomCount = Math.round(Math.random() * (imgCount - 1)) + 1;
var images = new Array();
images[1] = "1.png",
images[2] = "2.png",
images[3] = "3.png",
document.body.style.background = "url(" + dir + images[randomCount] + ")";
</script>
</body>

由于某种原因,JS 滚动随机选择的背景,我不希望/不需要它。另外作为旁注:我设法让它在某一点停止滚动,但是当我添加背景颜色时,背景图像的一半被遮盖了,你看不到背景图像本身。

感谢帮助

最佳答案

之所以会这样,是因为background是一个复合属性,包括background-colorbackground-imagebackground -repeat, background-position, background-attachment.这意味着当您单独设置 background 而不指定 background-repeat 时,您只需覆盖以前定义的规则,它就会回退到默认值 repeat。要修复它,您应该明确提供它:

document.body.style.background = "url(" + dir + images[randomCount] + ") no-repeat";

或设置background-image insted:

document.body.style.backgroundImage = "url(" + dir + images[randomCount] + ")";

关于javascript - CSS 背景重复 : no-repeat; still repeating,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22286230/

28 4 0
文章推荐: java - 使用 Java(同步)但始终运行相同线程的生产者/消费者模型
文章推荐: java - 两个传入 REST json 的公共(public) dto
文章推荐: java - 如何使用 Stream.flatmap 将被展平的对象与展平的对象结合起来
文章推荐: javascript - 选择不正确的值 HTML