css - 无法在我的网页上滚动

标签 css

我是 HTML/CSS 的初学者,我遇到了一个对我来说很奇怪的问题。不记得我在开始学习时遇到过这个问题。然而,问题是当我调整浏览器窗口大小时无法滚动。她是代码:

<!DOCTYPE html>
<html>
<head>
<body>
<img id="pic" src="http://0.tqn.com/f/lg/a154.png"/>
<style>
#pic {
position: fixed;
left: 1060px;
top: 150px;
right: 300px;
bottom: 658px;
}
</style>
</body>
</head>
</html> 

我把图片的位置放在左边和右边,因为这是我知道的将图片固定在一个特定位置的唯一方法。我试过自动,但当我调整浏览器大小时图片移动了。 感谢您的时间和精力

最佳答案

好的,我认为您遇到的问题是,当您绝对定位元素时,它会将其从文档流中移除。

所以把它想象成好像从页面主体中删除了绝对元素。

页面主体始终占浏览器的 100% 宽度。您的图片位于浏览器视口(viewport)之外。

你有两个选择。要么不使用绝对定位,要么使用 css 布局将图像放在适当的位置。

或者您可以将浏览器的宽度设置为您需要的宽度,例如1200 像素

第一个选项更适合现代和面向 future 的站点。

关于css - 无法在我的网页上滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19102404/

相关文章:

javascript - 单击子项时如何使用 jQuery 将类添加到父元素?

css - 使用 SCSS 的有效 CSS 结构

javascript - 有没有办法根据 css 属性忽略某些 transitionend 事件?

jquery - 如果 margin 和 padding 为 0,为什么 imgs 之间有空格?

css - 如何调整 Firefox 附加 SDK 弹出窗口/面板的大小? Firefox 附加 SDK 弹出窗口/面板太小

html - 如何强制容器元素包含水平内容?

javascript - 如何在使用 JavaScript/JQuery 单击单选按钮时突出显示表格单元格 (TD)?

javascript - ionic : Avoid redirecting for button in ion-list

php - 修改显示/隐藏以包含 php

html - 调整浏览器大小时,我的网站也会随之调整大小