先上代码
<div class="container ">
<div class="box">
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
<div class="content">
</div>
</div>
</div>
结构如上
CSS如下
html,body{
width: 100%;
height: 100%;
}
.container{
width: 100%;
overflow-x: scroll;
overflow-y: hidden;
}
.box{
width: 8rem;
height: 1rem;
}
.content{
box-sizing: border-box;
float:left;
height: 1rem;
width: 1rem;
border:1px solid #FF0000;
}