CSS使背景高度落后于内容

Question

我想用背景制作div，我想在div中制作oeverlay效果。这就是我的工作。

我想这样做

＆＃13;

＆＃13;

body {
  background: blue;
}

.wrap {
  height: 300px;
  width: 600px;
  margin: 0 auto;
  background-color: #000000;
}

.background {
  padding: 20px;
  background: #ffffff;
  background: -moz-linear-gradient(center top, #ffffff 50%, #e5e5e5 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(.5, #ffffff), color-stop(1, #e5e5e5));
  background: -o-linear-gradient(top, #ffffff 50%, #e5e5e5 100%);
  background: -ms-linear-gradient(top, #ffffff 50%, #e5e5e5 100%);
}

＆＃13;

<section class="background">
  <div class="wrap"></div>
</section>

＆＃13;

＆＃13;

＆＃13;

Answer 1

这样的事情可能会让你开始。

您可以使用Sys.setenv("R_BROWSER" = old_R_BROWSER) options(browser = old_browser) 从HTML流中删除position:absolute; div，以便将 relative 定位到其父元素（在这种情况下，.wrap）

请注意，您必须将.container div设置为container或position:relative，以使position:absolute适用于position:absolute div。

＆＃13;

＆＃13;

wrap

＆＃13;

body{
	background:blue;
}
.container{position:absolute;height:1000px;}
.background{
    height:200px;
    width:400px;
    margin-top:150px;
	padding:20px;
	background: #ffffff;
}
.wrap{
    position:absolute;
    top:20px;
    left:50px;
	height:250px;
	width:350px;
	margin:0 auto;
	background-color:#000000;
}

＆＃13;

＆＃13;

＆＃13;