将`position：fixed`应用于`body`会导致滚动条丢失 [英] Applying `position: fixed` to `body` makes it lose the scrollbars
问题描述
我正在尝试一些操作，将 position：fixed 应用于网页的 body 标签。然后我继续将所有边（顶部，底部，左边，右边）应用到0，以便它覆盖所有视口。
我的期望是它将是虚拟的就像没有添加固定位置一样，但现在我没有任何滚动条来移动页面。如果我应用 overflow：scroll ，虚拟禁用的滚动条会出现，而不是真正的让我到页面底部的滚动条。
我正在尝试所有这些扩展功能。这就是为什么我要移动 body 标记。
注意：如果我将所有样式应用于 html 标记。
根据评论和答案的建议，基本上不能在 position：fixed 元素上具有滚动条，但是您可以将它放在子元素上，所以在这种情况下，请设置< ; html> 标记为固定，
html {position：fixed;溢出：自动;左：0;正确：0; top：0;底部：0;背景：银;}身体{高度：100％;保证金：0;溢出：自动;背景：aqua;}
content< br /> content<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br /> ;内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br /> ;内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容<峰; br />内容
I'm trying something, where I apply position: fixed to the body tag of a webpage. Then I proceed to apply all the sides (top, bottom, left, right) to 0 so that it covers all the viewport.
My expectation was that it would be virtually the same as not having added the fixed position at all, but now I don't get any scrollbars to move the page. If I apply overflow: scroll, dummy disabled scrollbars appear, and not the real ones that can get me to the bottom of the page.
I'm trying all this stuff for an extension. That's why I want to move the body tag.
Note: this also happens if I apply all the styling on the html tag.
As per comment and answer suggested, you basically cannot have the scroll bar on a position:fixed element, but you can have it on the child element, so in this case, set the <html> tag as fixed, and <body> to overflow.
html {
position: fixed;
overflow: auto;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: silver;
}
body {
height: 100%;
margin: 0;
overflow: auto;
background: aqua;
}
content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content<br/>content
这篇关于将`position：fixed`应用于`body`会导致滚动条丢失的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
