如何让div根据内容自动显示水平垂直滚动条

最新推荐文章于 2024-05-30 18:55:27 发布

alphayycn

最新推荐文章于 2024-05-30 18:55:27 发布

阅读量8.1k

点赞数

CC 4.0 BY-SA版权

文章标签： div html ie

本文链接：https://blog.youkuaiyun.com/alphayycn/article/details/1840028

本文介绍如何使用HTML和CSS设置div元素内的滚动条，包括横向和纵向滚动效果，并确保跨浏览器兼容性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用style
div style="overflow:auto;" div中的内容超长时，自动出来
水平：overflow_x
垂直:overflow_y

详细代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
</head>
<body>

<p>这个是横向滚动，兼容ie与 ff</p>

<div style="color: blue; background-color: white; border: green solid 1px;overflow:scroll;width:160;height:160;"><nobr>
接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分
</nobr>
</div>

<p>这个不兼容ff</p>

<div style="color: blue; background-color: white; border: green solid 1px;overflow:scroll;width:160;height:160;display:inline;"><nobr>
接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分
</nobr>
</div>

<p>这个是纵向滚动</p>

<div style="color: blue; background-color: white; border: green solid 1px;overflow:scroll;width:160;height:160;">
接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分
接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分
接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分接分
</div>

</body></html>