Divの背景がDivに配置されない
-
22-07-2019 - |
質問
クラスとIDを使用してスタイルを設定するDivがいくつかあります。div自体は、背景のプレースホルダーに過ぎないため空です。例Div:
<div id='ranImg1' class='ranImg'></div>
次に、このcssを使用してスタイルを設定します:
.ranImg {
position:fixed;
z-index:0;
width:250px;
height:250px;
display:block;
}
#ranImg1 {
left:10px;
top:200px;
background-attachment:fixed;
background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
background-repeat:no-repeat;
}
Divがドキュメントの左上にある限り、画像は正しく表示されますが、Divがページの別の場所に配置されると、ページの左上隅に画像が表示されたままになります。 divと重なります(この例では、画像の下部になります)。
編集
私は他のレイアウトに影響を与えずにこれらのDivを配置しようとしていますが、それらは他のレイアウトの背後にあります。これは、背景画像がdivの位置に従っていないという事実を除いて機能します。
だから基本的に私の質問は、なぜranImg1 divの背景がdivに配置されず、左上隅に留まるのか、そしてそれを修正する方法ですか?
解決
background-attachment:fixed
は、ブラウザウィンドウに相対的な背景画像を添付します。 「フォロー」したい場合 div
の位置、次の行を削除します。
#ranImg1{
left:10px;
top:200px;
background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
background-repeat:no-repeat;
}
background-position
属性を設定して、含まれているdivを基準にして背景を設定することもできます。
background-position: 0px 0px;
それが background-attachment
を削除するだけで役立つかどうかはわかりません(まだコーヒーが足りません!)
所属していません StackOverflow