4

我需要将 .gif 图像修复到主页上的特定位置。我已将图像放在我的 HTML 中，但“位置：固定”并没有做我想要的 - 页面的其余内容在图像下方滚动。我希望图像始终保持在同一个位置。

免责声明：我对 HTML 和 CSS 几乎一无所知，所以如果这是一个非常简单的问题，我深表歉意。我已经进行了研究，但我尝试过的任何方法似乎都不起作用。

在相关说明中，我的图像会根据我正在查看我的网站的浏览器来改变大小。我在这里阅读了另一个问题的答案，您可以通过使用百分比而不是像素来格式化您的对象来解决这个问题，但我试过了并且问题依然存在。

其他注意事项：我使用 Chrome 作为浏览器，并且正在使用 Weebly 构建我的网站。我的网站地址是http://www.designartistree.com/和有问题的图像在页面中间的大“Design Artistree”标志下方的丝带。

任何对初学者友好的建议将不胜感激！谢谢！

这是我为图像提供的 html 代码：

<img src="/files/theme/ribbon.gif" alt="ribbon" style="position:fixed; margin-left:27.6%; margin-top:61%; width:63.7%; height:10%; z-index:50; visibility:show">
4

1 回答 1

6

如果使用position:fixed，则元素相对于窗口定位，因此即使滚动，元素也不会移动。

如果您希望它在滚动时移动，请使用position:absolute.

但是由于您的布局，您有两个选择：

  • 把图片放在里面#box
  • 删除以下代码：
html{
    overflow:hidden;
    height: 100%;
    max-height: 100%;
}
body {
    height: 100%;
    max-height: 100%;
    width: 100%;
}
#box {
    height: 100%;
    max-height: 100%;
    overflow: auto;
    width: 100%;
}
于 2012-09-11T00:13:53.013 回答