0

こんにちは、私は mvc4 でプロジェクトをやっています。私のレイアウトページには透明な div(#wrapper) があり、その上に多くの非透明な div があります。そのために、次の css および html コードを使用します。

<div id="wrapper">
<div id="header">
    <div id="logo"></div>
    <div id="navigation"></div>
</div>
 <div id="content">
    @RenderBody()
</div>
</div>

CSS

#wrapper {
position:relative;}

#wrapper:before {
margin-left:12%;
width:76%;
background-color:#6c88b6;
content:'';
min-height:400px;
height:auto;
overflow:hidden;
position:absolute;
opacity:.5;}

#header {
position:relative;
}

#logo {
margin-left:3%;
margin-top:20px;
margin-bottom:20px;
display:inline-block;
height:70px;
width:300px;
background:url(../Shared/Images/logo.png) no-repeat center left ;
}

#navigation {
margin-left:1%;
width:98%;
background-color:#fff;
height:50px;
}

#content {
  position:relative;
}

私の問題は、内側の div のラッパー (非透明な div) の位置が正しくないことです。それらはラッパー div 内に表示されません。どうすれば彼らの位置を修正できますか。

4

1 に答える 1

0

これが私が見つけた作品です。div を使用して、高さ、幅、パディング、およびその他の書式設定オプションを設定します。次に、色、透明度、およびその他の装飾を設定するためのクラス要素。クラスを透過的にするには

#class {
background-color:rgba(108.136.182.0.5)
}

そのコードは、「#wrapper」div に配置するだけでも機能するはずです。最初の 3 桁は色で、最後の 1 桁はオブジェクトの不透明度です。また、「1.0」または 1 は 100% に等しいため、0.5 を使用しました。

于 2014-07-30T17:32:57.940 に答える