我有这个div:
<div style='overflow:scroll; width:400px;height:400px;'>here is some text</div>
滚动条总是可见的，即使文本没有溢出。我想让滚动条只在必要时才可见——也就是说，只在框中有足够多需要它们的文本时可见。就像文本区域一样。我怎么做呢?或者是我唯一的选择样式一个文本区域，使它看起来像一个div?
使用overflow: auto。滚动条只会在需要时出现。
(注:您还可以只指定x或y滚动条:overflow-x: auto和overflow-y: auto)。
试试这个:
<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
try
<div style='overflow:auto; width:400px;height:400px;'>here is some text</div>
try
<div id="boxscroll2" style="overflow: auto; position: relative;" tabindex="5001">
我发现div的高度仍然显示，当它有文本或没有。所以你可以用这个来获得最好的效果。
<div style=" overflow:auto;max-height:300px; max-width:300px;"></div>
你可以试试下面这个:
<div style="width: 100%; height: 100%; overflow-x: visible; overflow-y: scroll;">Text</div>
斯塔克闪电游乐场
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
#scrollable-content {
background: #eee;
height: 150px;
width: 400px;
overflow-y: scroll;
}
</style>
</head>
<body>
<div id="original-content"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </div>
<br />
<div id="scrollable-content"> Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. </div>
</body>
</html>
