css平行排列且没有间距

CSS提供了各种方式来实现平行排列元素的效果。其中一种方式是使用display:inline-block。这种方式令元素像inline元素一样排列，但是又能够具备block元素的宽高特性。

.box{
      display:inline-block;
      width:100px;
      height:100px;
      background-color:blue;
}

需要注意的是，使用inline-block方式排列元素，会在元素之间产生一定的间距。我们可以通过设置父元素的font-size:0来消除这些间隙。

.parent{
      font-size:0;
}
.parent .box{
      display:inline-block;
      width:100px;
      height:100px;
      background-color:blue;
      font-size:16px;
}

另外一种方式是使用flexbox布局。这种方式可以控制元素的排列顺序、对齐方式等属性，非常灵活。

.parent{
      display:flex;
      justify-content:center;
      align-items:center;
}
.parent .box{
      width:100px;
      height:100px;
      background-color:blue;
      margin:0 10px;
}
    

以上是实现平行排列元素但没有间距的两种方式，可以根据实际需求选择使用。

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！