Question

我有CSS问题。我将尝试使用图片向您解释我的问题。我有一个这样的网页： This must be normal view

这是我不想要的视图： Content view overflows from page but there is no scrolling in page

但我不想要这些。我想要这样：内容（内容div）充满了单词，它会扩展到底部，页面右侧会出现一个滚动。因此，我想要一个内容扩展而不会影响顶部div，但效果底部div可以一起移动。

我希望我已经解释了我的问题..

Answer 1

我不确定，但我认为这就是你想要的：

HTML：

<body>
    <div id="content">
        <div id="top">This is the top div</div>
        <div id="main">This is the main div</div>
        <div id="bottom">This is the bottom div</div>
    </div>
</body>

CSS：

body{
    width: 100%;
    margin: 0px;
    padding: 0px; 
}

#content{
    margin: 0px auto;
    width: 800px;
}

#top{
    text-align: center;
    background-color: #FF0;
    height: 100px; 
    width: 800px;
    position: fixed;
    top: 0px;
}

#main{
    margin-top: 100px;  
}

#bottom{
    text-align: center;
    background-color: #FF0;
    height: 100px; 
    width: 800px;
}

Answer 2

您可以在CSS中使用overflow：auto以及固定高度，以便当div中的内容变得过大而不是展开时，div会显示滚动条。希望这会有所帮助。

CSS，<div>标签的高度和滚动</div>

2 个答案: