4

ホームページの特定の場所に.gif画像を修正する必要があります。画像をHTMLに配置しましたが、「position:fixed」は希望どおりに機能しません。ページの残りのコンテンツは画像の下にスクロールします。画像を常に同じ場所に置いておきたい。

免責事項:HTMLとCSSについてはほとんど何も知らないので、これが非常に単純な質問である場合はお詫び申し上げます。私は調査を行いましたが、試したことは何もうまくいかないようです。

関連するメモとして、サイトを表示しているブラウザに応じて画像のサイズが変わります。ピクセルの代わりにパーセンテージを使用してオブジェクトをフォーマットすることで解決できるという別の質問に答えてここを読みましたが、それを試してみました問題は残っています。

その他の注意事項:ブラウザとしてChromeを使用しており、Weeblyを使用してサイトを構築しています。私のウェブサイトのアドレスはhttp://www.designartistree.com/で、問題の画像はページ中央の大きな「DesignArtistree」ロゴの下にあるリボンです。

初心者向けのアドバイスをいただければ幸いです。ありがとうございました!

これが私が画像のために持っている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

ただし、レイアウトのため、2つのオプションがあります。

  • 画像を中に配置します#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 に答える