シャドウマスク_html/css_WEB-ITnoseを持つことができるこのようなWebページのフローティングボックスを実装する方法を教えてください。

写真に示すように...

ディスカッションへの返信(解決策)

個人的には3つのレイヤーであるべきだと思います
最初のレイヤーは一番上のレイヤーです: 新しいバージョンのブログ... とかdivでパックしてFloating、スタイルは画像にして指定した場所に揃えます。
2 番目のレイヤーは中央: フルスクリーン div: 黒で、透明度を変更して影の効果を表示します。
3 番目の層は情報層です。

クリックして表示するか、取得して 2 番目のレイヤーを非表示にします。

これは私の推定です、それが正しいかどうかはわかりません。

個人的には 3 つのレイヤーであるべきだと思います
最初のレイヤーは、ブログの新しいバージョンです。スタイルとしては、ただの画像です。を選択し、指定した場所に位置を合わせます。
2 番目のレイヤーは中央: フルスクリーン div: 黒で、透明度を変更して影の効果を表示します。
3 番目の層は情報層です。

クリックして表示するか、取得して 2 番目のレイヤーを非表示にします。

これは私の推定です、それが正しいかどうかはわかりません。


でも、3 つのレイヤーの書き方がまったくわかりません...

z-index スタイルを使用すると、オンラインでこの属性の使い方を確認できます。とても簡単です。
ははは！お役に立てば幸いです

フォーカス モード

フォーカスする四角形の他の場所をカバーする 4 つの div