我的网站出现问题:当窗口大小与背景图像相同或更大时,一切都可以正常打开,但当我在较小的窗口上打开时,没有滚动条,因此页脚消失了。
附件是一个小窗口发生的情况的图像:
和
最佳答案
您的页脚正在消失,因为元素 #footer
设置了固定高度 835px。这导致页脚始终距离 浏览器窗口 顶部 835 像素。一旦窗口大小小于 835px,页脚就不再可见。
为了保持页脚可见,尝试将位置更改为 absolute
而不是 fixed
。这会将页脚定位在距顶部 835px 的位置,相对于网页本身的顶部,而不是浏览器窗口的顶部。
为保证页脚在任何尺寸的屏幕上始终可见,您还可以将 min-height: 835px;
应用于您的 body 标签。
编辑
为了在使用绝对定位时保持页脚居中,请尝试结合使用 left
和 margin-left
。无论窗口大小如何,下面的样式都会使您的页脚居中。
#footer {
list-style: none;
position: absolute;
left: 50%; /* Always display footer 50% left of the screen width. */
margin-left: -446px; /* -(Total footer width / 2) I.E. -(892px / 2) = -446px; */
top: 835px;
font-size: 14pt;
}
关于html - 在较小的窗口上打开时没有滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18134483/