繁体   English   中英

如何使用wp_nav_menu()将子类别分为几列?

[英]How to split child categories into columns using wp_nav_menu()?

我有一个导航菜单,该菜单使用Wordpress的wp_nav_menu()函数在下拉子菜单中首先呈现父类别和所有子类别到该类别。 标记如下所示:

<li id="menu-item-256" class="category-electronics menu-item menu-item-type-taxonomy menu-item-object-category">
    <a class="expander-btn" href="#">
    <div class="drop-down">
        <div class="arrow left"></div>
        <ul class="sub-menu">
            <li id="menu-item-272" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-271" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-270" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-269" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-268" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-267" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-266" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-265" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-264" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-263" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-262" class="menu-item menu-item-type-taxonomy menu-item-object-category">
            <li id="menu-item-261" class="menu-item menu-item-type-taxonomy menu-item-object-category">
        </ul>
    </div>
</li>

我希望能够将子类别分为几列(每列中有5或6个链接),但是我真的不知道该怎么做。 我现在已经花了将近30个小时,但无济于事,所以任何想法都将不胜感激。 提前致谢!

您始终可以使用http://codex.wordpress.org/Function_Reference/wp_nav_menu#Using_a_Custom_Walker_Function格式化所需数量的HTML标记列。

仅使用CSS还有另一种解决方案。 只要把宽度上的<ul>所述的和宽度<li>所述<ul>应两倍宽的<li>并漂浮在<li>的元素。

  • 第一列中的第一<li>
  • 第二列中的第二个<li>
  • 第一列中的第三<li>
  • 等等

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM