如何向该图像背景添加滚动条？
<!DOCTYPE html>
<html>
<head>
<title>VBS</title>
<style>
body {
background-image: url(https://imgur.com/CahbpxJ.jpg);
min-height: 100%;
background-size: cover;
background-repeat: no-repeat;
}
</style>
</head>
<body>
</body>
</html>
我把图片放在背景中的原因是我需要把按钮和其他元素放在它上面。还有其他方法可以实现吗？
最佳答案
你原来问题的答案是:
为什么会有人想要背景滚动条？背景只是背景。如果它是一个重要的内容，那么它不应该在后台。把它带到前面，让它成为标准img元素或标准元素的背景。
如果我们转换您的评论:
If you add it as an
<img>then you cant put buttons etc on top of that image. If you add it as a background, then you can add elements on top of the image
一个问题:
How to put buttons and other elements on top of an image?
那么答案就是:有很多方法可以做到。一种方法是将图像放在 div 中盒子是position: relative然后将按钮(或您想要的任何元素)添加到框中并使其成为 position: absolute .然后你可以将卷轴添加到 div盒子。这是一个演示:
.container {
position: relative;
width: 200px;
height: 200px;
overflow: scroll;
}
.container button {
position: absolute;
top: 50px;
left: 50px;
}<div class="container">
<img src="https://imgur.com/CahbpxJ.jpg" />
<button type="button">Click Me</button>
</div>关于html - 将滚动条添加到背景图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48700880/