0
イメージの上にメニューをオーバーレイしようとしていますが、イメージのコンテナは可変です。私はイメージがどこにあるか、どれくらい大きいかわからない。左上の座標をどこに設定するかを知らずに、画像上に絶対/固定の何かを配置するにはどうすればよいですか？動くdivを作るには固定オーバーレイされた要素が内部にありますか？
body {
box-sizing: border-box;
border: 0;
padding: 0;
}
.main-container {
height: 500px;
width: 100%;
background-color: #282828;
padding: 0;
}
.moving-container {
display: inline-block;
margin-top: 100px;
background-color: red;
width: 100%;
height: 100px;
}
.content {
z-index: 1;
width: 100%;
height: 50%;
background-color: white;
}
.overlay {
z-index: 2;
width: 300px;
height: 150px;
background-color: blue;
}
<body>
<div class="main-container">
<div class="moving-container">
<div class="content">
</div>
<div class="overlay">
</div>
</div>
</div>
</body>
ここにはexample that doesn't workがあります。オーバーレイオブジェクトである青色の枠線のボックスが、白いフルスパンのdivの下にどのようにプッシュされているかを確認できます。
私はポジションアブソリュートを使用していますが、固定であればthisとなります。
イメージを要素の背景として設定しようとしましたが、要素の内部はメニューになりますが、要素の大きさはわかりません。固定のpx値では、背景画像は表示されません（メニュー自体よりも大きくなります）。
どうすればいいですか？私は翻訳を見つけましたが、私はそれを実装していません。
上記の例では、幅がちょうど100％のところで動作する固定高さ寸法があります。
ありがとうございました。
私は、セレクタの後にそれに慣れていませんよ？ CSSで二重コロンが何を意味するのかは不明です。それは私がポジションの相対的な位置で絶対にこれを行うことができます、gahhh ...私は私が解決策を見つけてうれしいことを意味しますが、男...この質問に答えなかったなら削除されるでしょう。あなたのご意見ありがとうございます。 – janicehoplin
CSS疑似クラスについて少しお読みください。すぐにダブル '::'を使用します。 https://developer.mozilla.org/en-US/docs/Web/CSS/Pseudo-classes –
私はホバーセレクターのようなものを見たことがあるかもしれないが確かではないと思う。リンクありがとう。 – janicehoplin