Question

嗨，我在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中的显示。我怎样才能纠正他们的立场。

Answer 1

这是我找到的作品。使用div设置高度，宽度，填充和其他格式选项。然后是一个类元素来设置任何颜色，透明度和其他化妆品。要使类透明，请使用

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

如果您只是将它放入“#wrapper”div中，那么代码也应该有用。前三个小数是颜色，最后一个是对象的不透明度。 “1.0”或1也等于100％，这就是我使用0.5

的原因

非透明div在透明div问题上的位置

1 个答案: