flex 設置換行flex-wrap

flex 設置flex-wrap 換行

本來預想的正常情況下，代碼應該如下：

ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    li {
      flex: 1;
      width: 25%;
}

但是這樣的代碼的寬度不生效，效果圖如下

后來發現，加上li 的最大寬度和最小寬度

ul {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    li {
      flex: 1;
      width: 25%;
      min-width: 25%;
      max-width: 25%;
｝

這樣，li 的寬度才能正常顯示。