首页 > 解决方案 > 我的导航菜单的 Css 代码在 Wordpress 主题中不起作用

问题描述

在为我自己的 Worpress 主题制作自定义导航菜单时,导航菜单的 css 代码的一些代码正在工作,而在为 Wordpress 主题输入 php 导航代码时,一些代码不起作用。

这是我用于 wordpress 导航菜单的 php 代码

    <?php   wp_nav_menu( array(
                                'theme_location'    => 'primary',
                                'depth'              => 2,
                                'container'         => 'ul',
                                'container_class'   => '',
                                'menu_class'        => 'nav-link',
                                'fallback_cb'       => 'WP_Bootstrap_Navwalker::fallback',
                                'walker'            => new WP_Bootstrap_Navwalker())
                                 );?>

所以我在导航菜单中有这么多类,所以我的 css 代码很长,这就是为什么我要为导航栏添加我的 html 代码。这是我用于导航菜单的 html 代码。

<ul>
                 <li class="nav-link" style="--i: .6s">
                       <a href="/home.php">Home</a>
                   </li>
                   <li class="nav-link" style="--i: .85s" >
                       <a href="#">Categories<i class="fas fa-caret-down"></i></a>
                       <div class="dropdown ">
   
                           <ul> 
                               <li class="dropdown-link">
                                   <a href="/pages/motivation.php">Motivation</a>
                               </li>
                               <li class="dropdown-link">
                                   <a href="/pages/health.php">Health</a>
                               </li>
                               <li class="dropdown-link">                    
                               <a class=" href="/pages/science&tech.php">Science & Technology</a>
                                            
                               </li>
                               <li class="dropdown-link">
                                   <a href='/pages/finance.php'>Finance</a>
                               </li>
                               <li class="dropdown-link">
                                   <a href="/pages/random.php">Random</a>
                               </li>
                               <div class="arrow"></div>
                           </ul>
                       </div>
                   </li>
                   <li class="nav-link" style="--i: 1.1s">
                       <a href="#">Archives<i class="fas fa-caret-down"></i></a>
                       <div class="dropdown">`enter code here`enter code here`
                           <ul>
                               <li class="dropdown-link">
                                   <a href="/pages/contact.php">Contact us</a>
                               </li>`enter code here`
                               <li class="dropdown-link">
                                   <a href="/pages/privacypolicy.php">Privacy Policy</a>
                               </li>
                               <li class="dropdown-link">
                                   <a href="/pages/terms&andcondition.php">Terms & Condition</a>
                                   
                               </li>
                               <li class="dropdown-link">
                                   <a href="/pages/disclaimer.php">Disclaimer</a>
                               </li>
                               <div class="arrow"></div>
                           </ul>
                       </div>
                   </li>
                   <li class="nav-link" style="--i: 1.35s">
                       <a href="/pages/about us.php">About</a>
                   </li>
               </ul>   

我的 php 代码有问题。你能为我的导航栏提供正确的代码吗?

标签: phphtmlcsswordpressmenu

解决方案


我们没有在上下文中看到您的代码,但您的'container'元素有错误。您必须设置navor div,而不是ul(我建议nav标记)。记住'container_class'也要定义。

然后,您必须在电子表格中定义您的 CSS 规则,包括您的 container_class。如果有必要,您必须使用!important.


推荐阅读