Question

我有三个div层。第一层是具有指定高度的背景。第二层是content-class的透明div。第三层是内容。我想删除.content类的滚动，我想用浏览器滚动滚动文本。我该怎么办？

＆＃13;

.container{
  background-color:black;
  height:400px;
  wdith:100%;
}   
.backtransparent{
  background-color: gray;
  width:250px;
  height:100%;
  margin: 0 auto;
}   
.content{
  width:200px;
  margin: 0 auto;
  background-color:white;
  position:absolute;
  overflow:auto;
  height:400px;
  left: 0;
  right:0;
}

＆＃13;

<div class="container">
  <div class="backtransparent">
    <div class="content">
       Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur mollitia maxime facere quae cumque perferendis cum atque quia repellendus rerum eaque quod quibusdam incidunt blanditiis possimus temporibus reiciendis deserunt sequi eveniet necessitatibus maiores quas assumenda voluptate qui odio laboriosam totam repudiandae? Doloremque dignissimos voluptatibus eveniet rem quasi minus ex cumque esse culpa cupiditate cum architecto! Facilis deleniti unde suscipit minima obcaecati vero ea soluta odddio cupiditate placeat vitae nesciunt quis alias dolorum nemo sint facere. Deleniti itaque incidunt eligendi qui nemo corporis ducimus beatae consequatur...
    </div>
  </div>
</div>

＆＃13;

以下是完整示例：https://jsfiddle.net/yrp4pmmc/2/

Answer 1

你的意思是like this?

.container{
background-color: black;
height: 400px;
width: 100%;
overflow: auto;
}
.content{
width: 240px;
margin: 0 auto;
background-color: white;
left: 0;
right: 0;
border-left: 20px solid grey;
border-right: 20px solid grey;
}

Answer 2

除非我误解了你的问题，否则你所要做的就是删除你的绝对定位并使父div高度为100％。

删除div上的指定高度可确保它们占用内容的大小，因为默认情况下为div。然后，当你限制.content元素的宽度并删除它的滚动能力时，.container必须占用其子元素的整个高度。

.container{
   background-color:black;
   height: 100%;
   width:100%;
}

.backtransparent{
  background-color: gray;
  width:250px;
  height:100%;
  margin: 0 auto;
}

.content{
  width:200px;
  margin: 0 auto;
  background-color:white;
  overflow:auto;
  height: auto;
}

https://jsfiddle.net/Kyle_/yrp4pmmc/3/

如何滚动一个位置：绝对的滚动滚动？

2 个答案: