关于display:inline-block和float：left的区别

 <div class="pag">
     <a href="#">首页</a>
     <a href="#">上一页</a>
     <a href="#" class="choose">1</a>
     <a href="#">2</a>
     <a href="#">3</a>
     <a href="#">4</a>
     <a href="#">5</a>
     <a href="#">6</a>
     <a href="#">下一页</a>
     <a href="#">最后</a>
 </div>

展示效果：

这是一段分页的html，关于他的样式我写了两种方式。

1.display:inline-block

 .pag a{
     display: inline-block;
     border: 1px #ddd solid;
     padding: 6px 13px;
     background: #fff;
     font-size: 16px;
     color: #333333;
     text-decoration: none;
 }
 .paging .pag .choose{
     background: #00a1f6;
     color: #fff;
 }

展示效果：

2.float:left

 .pag a{
     float: left;
     border: 1px #ddd solid;
     padding: 6px 13px;
     background: #fff;
     font-size: 16px;
     color: #333333;
     text-decoration: none;
   }
   .pag .choose{
     background: #00a1f6;
     color: #fff;
   }

展示效果: