java横向滚动条_水平滚动条丶Java教程网-IT开发者们的技术天堂

一行超出的内容默认是垂直方向显示滚动条，如果需要水平方向滚动条

主要用到并排Div 的父级设置white-space: nowrap，并排的div设置display:inline-block;

因为display:inline-block 会引起几个像素的空隙，需要在父级设置font-size:0;可以去掉相邻小div的空隙

完整的代码如下：

标题11

标题11

标题11

.all-smallImg-wrap{height:160px;white-space: nowrap;font-size:0;}

.smallImg-wrap{width:25%;display:inline-block;height:160px;padding-right:15px;}

.smallImg-wrap .smallImg{border:1px solid #ccc;text-align:center;display:table-cell;width:1%;vertical-align:middle;height:130px}

.smallImg-wrap .smallImg img{max-width:100%;max-height:100%;}

.smallImg-wrap>div.title{text-align:center;line-height:30px;font-size:14px;}