div 如何加滚动条？

div 加滚动条的两种方法：

一、

<div style=" overflow:scrollwidth:400pxheight:400px”></div>

记住宽和高一定要设置噢，否则不成的

不过在不超出时，会有下面的滚动条，所以不是最好的选择

二、

<div style=" overflow-y:autooverflow-x:autowidth:400pxheight:400px”></div>

记住宽和高一定要设置噢，否则不成的

这样比较好的是，在宽和高不超出时，只是一条线

三、说明

直接为div指定overflow属性为auto即可，但是必须指定div的高度，如下：

<div style="position:absoluteheight:400pxoverflow:auto">

</div>

如果要出现水平滚动条，则： overflow-x:auto

同理，垂直滚动条为： overflow-y:auto

如果该div被包含在其他对象例如td中，则位置可设为相对：position:relative

1、<div style="height:300pxwidth:100pxoverflow:auto"><div/>（height和width根据需求设定）

注意:如果只写height就只有垂直滚动条，只写width就只有水平滚动条,都不写没有效果。还有这里overflow设置为auto,也就说是如果你的页面高度大于300px就会出现滚动条，小于300px就没有滚动条。同理，如果宽度大于100px出现滚动条，小于就没有。

2、你也可以将overflow设置为scroll，即:<div style="height:300pxwidth:100pxoverflow:scroll"><div/>。这样设定的效果为

不管你的页面高度大于还是小于300px,都会出现滚动条，宽度同理。

3、也可以这样设置

水平滚动条：<div style="width:100pxoverflow-x:auto"></div>

垂直滚动条：<div style="height:300pxoverflow-y:auto"></div>

水平加垂直：<div style="width:100pxheight:300pxoverflow-x:autooverflow-y:auto"></div>

扩展资料

<div>可定义文档中的分区或节（division/section）。

<div>标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。

如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。

注释：<div>是一个块级元素，也就是说，浏览器通常会在 div 元素前后放置一个换行符。

提示：请使用 <div>元素来组合块级元素，这样就可以使用样式对它们进行格式化。

参考资料：百度百科 div

overflow

语法：

overflow : visible | auto | hidden | scroll 

参数：

1.visible :不剪切内容也不添加滚动条。假如显式声明此默认值，对象将被剪切为包含对象的window或frame的大小。并且clip属性设置将失效

2.auto :此为body对象和textarea的默认值。在需要时剪切内容并添加滚动条

3.hidden :不显示超过对象尺寸的内容

4.scroll :总是显示滚动条

说明：

检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。

设置textarea对象为hidden值将隐藏其滚动条。

对于table来说，假如table-layout属性设置为fixed，则td对象支持带有默认值为hidden的overflow属性。如果设为hidden，scroll或者auto，那么超出td尺寸的内容将被剪切。如果设为visible，将导致额外的文本溢出到右边或左边（视direction属性设置而定）的单元格。

自IE5开始，此属性在MAC平台上可用。

对应的脚本特性为overflow。

示例：

div { overflow: scroll height: 100px width: 100px }

效果如图：

---