html - 如何根据菜单中的项目数根据需要动态拥有更多列？

Question

我在 wp 中有一个动态的两级 UL LI 下拉菜单。实际上，它目前是一个两列菜单，并且行是根据子 li 元素的要求来的。在某些 LI 上，子元素有很多项目，我想以某种方式控制它只有 5 行，如果超过 5 行，那么我希望它有更多的列来容纳菜单中的所有项目。

目前它是一个浮动的 li 元素，在支持两列的固定宽度 UL 中具有固定宽度。

因此，我希望它根据需要具有 2/3/4 或 5 列，但行应始终为 5。

它是一个动态菜单，我不知道该怎么做。

Answer 1

一种解决方案是使用 php array_chunk函数将子项分成 5 个组，然后将不同列中的每个组呈现为单独的列表。

<?php
$items = array(1,2,3,4,5,56,6,63,7,8,9,876,5,4,436,23,57,575,4734,62);
$chunks = array_chunk($items, 5);       
foreach($chunks as $chunk) {
  $col = "<ul>";
  foreach($chunk as $value) {
    $col .= '<li>'.$value.'</li>';  
  }
  $col .= "</ul>";
  echo $col;
}