私のウェブページは全ページのストレッチ背景画像を使用しています。私の問題は、背景画像が、繰り返し背景画像の形で追加しようとしている上位10pxのバナー/ヘッダーを覆っているように見えることです(CSSの不透明度を使用できます)。これが全ページです:
<html><head>
<style type="text/css" media=screen>
body{
margin: 0px;
color: #000;
font-family: helvetica, times;
font-size: 14px;
}
#bg {
position: fixed;
top: 0;
left: 0;
/* Preserve aspet ratio */
min-width: 100%;
min-height: 100%;
}
#banner{
background: url('images/banner2.gif');
background-repeat: repeat-x;
top: 0;
left: 0;
width: 100%;
padding:50px;
text-align: center;
}
</style></head>
<body>
<img src="images/background.jpg" id="bg">
<div id="banner">
Banner Test Text
</div>
</body>
</html>
z-indexを追加しようとしましたが、解決策がありません。私が間違っていることについてのどんな入力も大いに感謝されます。フルページの背景画像のこの実装は、私が自分の画像で達成した最高のものであることに注意してください。したがって、それに対応するソリューションがあれば素晴らしいと思います。