すべてに % を使用しているため、サイトはすべての画面解像度で同じように動作します。ただし、コンテンツの位置がずれており、解像度やブラウザによって異なります。私が気づいたことと、おそらく問題に関連しているのは、背景画像がズームに反応しないことです。ただし、コンテンツは反応します。
html {高さ: 200%; 幅: 100%;}
本体 { 最小幅: 99%; 高さ: 100%; マージン: 0; パディング: 0; 色: #969696; 背景色: 黒; テキスト整列: 中央; フォントファミリー: Arial; フォントサイズ: 100%; }
容器 {
position: relative; height: 100%; margin: auto; width: 85%; text-align: center; border: 1px solid red; background-image: url('images/bgmain.png'); background-repeat: no-repeat; background-size: 100% 100%; overflow: hidden; }ナビゲーションバー {
position: relative; min-height: 2%; margin-top: 21%; margin-left: 2%; padding: 0 auto; width: 95%; text-align: center; overflow: hidden; }
たとえば、私の解像度のナビゲーション バーは問題ありませんが、他の解像度では位置がずれています。間違いはありませんか？私は何かが恋しいですか？前もって感謝します。