gpt4 book ai didi

html - 使用 CSS 滚动背景

转载 作者:行者123 更新时间:2023-11-28 08:40:26 24 4
gpt4 key购买 nike

我正在尝试获得可以向上/向下滚动以允许查看图像的背景。该代码似乎是正确的,但它不允许我滚动。这是我拥有的:

<!DOCTYPE html>
<html>
<!--CSS init-->
<style>
html {
background-image: url("../Pictures/example_bg.png");
background-repeat: no-repeat;
background-attachment: scroll;
}
</style>
</html>

最佳答案

使用background-attachment: scroll; 表示滚动时背景会跟随页面。这是默认值,因此您不必指定它。

您无法滚动查看整个图像,因为您的 body 元素中没有任何内容(而且根本没有 body 元素),因此页面只有几个像素高(默认边距/填充)。在 body 元素中放置一个元素,并为其指定与背景图像一样高的高度,您将能够滚动。

您还应该有一个 head 元素,这就是样式所在的位置:

<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
html {
background-image: url("../Pictures/example_bg.png");
background-repeat: no-repeat;
background-attachment: scroll;
}
div {
height: 4320px;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

关于html - 使用 CSS 滚动背景,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27829579/

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