gpt4 book ai didi

html - width 100% 出现滚动时剪切元素

转载 作者:太空宇宙 更新时间:2023-11-04 04:42:33 27 4
gpt4 key购买 nike

我有一个带有水平条的简单页面,它应该与文档页面一样长。问题是,当我将浏览器窗口的大小时调整到 body 的最小高度以上时,当我滚动文档时,部分栏没有显示。

搜索其他类似问题,我看到可以通过将 body 样式的 margin 和 padding 设置为 0px 来解决问题。

在我的例子中,如果我从栏的 css 中删除 position:absolute 就可以了。我该如何解决这个问题并使栏保持绝对定位?

我需要使用绝对定位,因为我的背景图像有一个 div 元素,它占据了页面的 100%(垂直和水平)。如果我在其后放置栏,div 元素不会留在原位。

<style type"text/css">

html, body
{
width: 100%;
min-width:500px;
height: 100%;
min-height:700px;
margin:0px;
padding: 0px;
}

#red {
position:absolute;
top:100px;
width:100%;
min-width:100%;
height:37%;
min-height:300px;
max-height:330px;
background: rgb(0,0,0);
margin: 0px;
padding: 0px;
}

#background
{
position:fixed;
width:100%;
height:100%;
background: rgb(56,54,0);
margin: 0px;
padding: 0px;
}

</style>

<body>

<div id="background"></div>
<div id="red"></div>

</body>
</html>

最佳答案

您可以在您的 css 中使用 position:relative

absoluterelative 的区别

绝对: 元素相对于其第一个定位(非静态)祖先元素定位。

相对: 元素相对于其正常位置定位,因此“left:20”向元素的 LEFT 位置添加 20 个像素。

关于 http://www.w3schools.com/cssref/pr_class_position.asp 上的位置的更多信息或 http://css-tricks.com/absolute-positioning-inside-relative-positioning/

关于html - width 100% 出现滚动时剪切元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15175905/

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