css中overflow属性设置滚动条的具体代码示例如下：
<!DOCTYPEhtml>
<html>
<head>
<metacharset="utf-8">
<title>css中overflow属性设置滚动条的具体用法示例</title>
<style>
.a1
{
background-color:#acffcb;
width:100px;
height:100px;
overflow:scroll;
}
.a2
{
background-color:#a7fcff;
width:100px;
height:100px;
overflow:hidden;
}
.a3
{
margin-top:10px;
background-color:#ccccff;
width:100px;
height:100px;
overflow:scroll;
overflow-x:hidden;
}
</style>
</head>
<body>
<divclass="a1">cssoverflow属性实现横向纵向滚动条，cssoverflow属性实现横向纵向滚动条</div>
<divclass="a2">cssoverflow属性实现隐藏全部滚动条，cssoverflow属性实现隐藏全部滚动条</div>
<divclass="a3">cssoverflow属性实现隐藏竖向滚动条，cssoverflow属性实现隐藏竖向滚动条</div>
</body>
</html>
上述代码在浏览器中访问效果如下图所示：
我们从图中可以看出，我们给a1添加了overflowscroll样式属性后，就出现了竖向和纵向的滚动条，那么在固定大小的div块中如果文本过多不完全显示，就可以通过拉动滚动条来实现查看剩下的内容。
overflow中scroll属性就表示滚动条设置。
当我们给a2添加cssoverflowhidden样式属性后，就去除所有的滚动条了。并且剩下的文本没有办法查看。我们再看a3的样式，这里我们添加了overflow-x:hidden样式属性后，就隐藏了横向滚动条。
通过上述描述，我们可以得知。想要通过css中overflow属性设置滚动条，掌握overflowscroll属性即可！而如果想要隐藏或者去除横向或者纵向滚动条的话，只要了解hidden、overflow-x、overflow-y的属性。overflow-x表示横向滚动条，overflow-y表示竖向滚动条，hidden则可以设置是否隐藏。
本文转载自中文网
本文转载自中文网
如需转载，请注明文章出处和来源网址：http://www.divcss5.com/css3-style/c55470.shtml
