html+css横向瀑布流+自带换行

主要运用flexwrap这个属性

思想: 设置最小宽度+flexwrap:wrap实现 CSS

.menu ul{
  display: flex;
  flex-wrap:wrap;
  padding: 0; margin: 0;/*height:30px;overflow:hidden;*/
}
.menu li{
  min-width: 25%;
  margin: 0;
  line-height: 30px; font-size: 14px;
  text-align:center;
}

效果

html+css横向瀑布流+自带换行_第1张图片

html+css横向瀑布流+自带换行_第2张图片

转载于:https://my.oschina.net/cfm880/blog/810078

你可能感兴趣的:(html+css横向瀑布流+自带换行)