可以使用CSS的flexbox布局来实现一排三个,并且每个li的垂直间距相等。

HTML代码:

<ul class="ulbox">
  <li class="tepe">
    
  </li>
  <li class="tepe">
    
  </li>
  <li class="tepe">
    
  </li>
  <li class="tepe">
    
  </li>
  <li class="tepe">
    
  </li>
  <li class="tepe">
    
  </li>
</ul>

CSS代码:

.ulbox {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.tepe {
  width: 30%; /* 每个li的宽度为30% */
  margin-bottom: 1em; /* li的垂直间距为1em */
}

这样就可以实现一排三个,并且每个li的垂直间距相等。你可以根据需要调整li的宽度和垂直间距的数值

ul class=ulbox				 li class=tepe style=min-height11em					 				 li				 li class=tepe style=min-height11em					 				 li				 li class=tepe style=min-height11em					 				 li				 li

原文地址: http://www.cveoy.top/t/topic/iSq0 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录