Question

我希望能够制作一个div，允许用户动态地将内容添加到特定地点，例如100px乘200px的区域，但只显示50px乘100px的窗口，供用户放置内容。用户将滚动以到达div的其余部分。我怎么能用CSS或JavaScript做到这一点？

REVISE

我希望我的div的高度和宽度从100x200开始，但只显示尺寸为50x100的窗口，并带有一个滚动条，让用户可以到达div的其余部分。

Answer 1

CSS：

#myDiv  {
    width:100px;
    height:50px;
    overflow:auto;
}

Overflow在这里发挥了作用。

Answer 2

试试这个：

HTML：

<div id="window">
    <div id="content">
    </div>
</div>

CSS：

#window {
    width: 50px;
    height: 100px;
    overflow: auto;
}

#content {
    width: 100px;
    height: 200px;
}

Answer 3

HTML：

<div id="myDivWindow">
 <div id="myDiv">
 </div>
<div>

的CSS：

#myDivWindow  {
    width:50px;
    height:100px;
    overflow:auto;
}

#myDiv  {
    width:100px;
    height:200px;
}

将您的内容添加到myDiv

Answer 4

最简单的方法是使用2 div。像这样......

<div style="width:100px;height:50px;overflow:auto;">
<div style="width:200px;height:100px;overflow:none;">
    <h3>This is a header</h3>
    <p>This is a paragraph.</p>
</div>
</div>

如果你不想在你的html中有这样的嵌套div元素，你可以添加一个类或id，并用JavaScript动态添加和设置第二个div。

创建一个显示尺寸与其内容尺寸不同的div

REVISE

4 个答案: