需要將圖像修復到頁面上的特定位置

Question

我需要將.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"> 

Answer 1

如果使用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%; 
}