Bootstrap导航栏类未正常工作。
Bootstrap导航栏类未正常工作。
以下是没有包含PHP的HTML代码,位于`ul li`标签内部:
以下是包含了PHP的HTML代码,位于`ul li`标签内部:
这是导航栏的图像,它的作用如下:
这是导航栏的图像,它没有加载CSS类:
问题原因:代码中存在重复的导航栏容器类和菜单类,导致导航栏样式无法正常工作。
解决方法:将重复的代码段删除即可。
以下是整理后的文章:
在这个例子中,我们将展示一段代码来展示导航栏:
<?php wp_nav_menu(array( 'theme_location' =>'primary', 'container' => 'nav', 'container_class' => 'navbar-collapse navbar', 'menu_class' => 'nav navbar-nav navbar-right' )); ?>
同时需要将以下代码删除:
<nav class="navbar navbar-default stroke"> <ul class="nav navbar-nav"> <?php $args = array( 'theme_location' => 'primary', ); ?> <li><?php wp_nav_menu($args);?></li> </ul> </nav>
问题的原因是navbar的class属性没有正确应用,导致样式不生效。解决方法是在代码中将class属性的值改为正确的值。
具体的解决方法如下:
将下面的代码中的'nav navbar-nav'修改为'navbar-nav',即可解决问题。
'primary', 'menu' => 'your menu name here', 'container' => '', 'container_class' => '', 'container_id' => '', 'menu_class' => 'navbar-nav', 'menu_id' => '', 'echo' => true, 'fallback_cb' => 'wp_page_menu', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '', 'items_wrap' => ' %3$s
', 'depth' => 0, 'walker' => '' ); wp_nav_menu( $header_menu_defaults ); ?>
通过将class属性的值修改为正确的值,即可解决Bootstrap导航栏样式无效的问题。
问题:Bootstrap navbar类不正常工作的原因是什么?
解决方案:使用walker类可以得到一个理想的解决方案。另外,也可以参考类似问题的解决方案。如果想要简单的解决方案,可以尝试以下代码。