css - 将硬编码菜单传输到 wordpress 并应用样式

标签 css wordpress twitter-bootstrap navigation

我在 HTML 网站上工作,使用 Bootstrap ,我想将它转移到 wordpress 并制作自定义主题,这就是我遇到的问题。

我使用 wordpress 管理面板制作了页面和菜单,现在我想将自己的样式添加到该菜单。这是代码:

<div class="navigation">
        <?php 
            wp_nav_menu( array(
                'theme_location' => 'primary',
                'container' => false,
                'menu_class' => 'navbar-nav'
                )
            ); 
        ?> 
                <ul class="navbar-nav">
                    <li class="nav-item right-border active">
                        <div class="mask"></div>
                        <a href="#" class="nav-link">HOME
                            <span class="sr-only">(current)</span>
                        </a>
                    </li>

导入所有类后,我需要删除整个 UL block ,只保留 wordpress 的菜单。

我可以使用“menu-class”=>“navbar-nav”访问 UL 类,但我不知道如何访问其他类(掩码、导航项、右边界、事件、导航链接、 sr-only)以及如何将当前状态应用到这个 LI block (在这个之后我有更多相同的 LI block 重复,但只有第一个是事件的)。

最佳答案

好吧,实际上我自己找到了答案。在我使用 wp_nav_menu() 函数后,它会生成一个菜单。我将它与

连接

'theme_location' => '主要'

所以它会提取我在 wordpress 中制作的所有页面。在那之后,我唯一需要做的就是打开页面并去检查页面。在检查器中,它将显示该函数将生成的所有标签,并且所有这些标签都已经为通用类分配了自己的设置。所以我可以只使用其中一个类并通过向它们添加我自己的样式来自定义它们,这将改变菜单的外观,并且它将应用我想做的一切。

以图片为例:

Menu generated by wp_nav_menu() function

如您所见,我可以使用所有这些通用类并只需编辑它们。

关于css - 将硬编码菜单传输到 wordpress 并应用样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46878089/

相关文章:

jquery - 切换到词缀时 Bootstrap 导航栏会抖动

html - 页面中间的中心导航菜单

css - 如何在 bootstrap glyphicons 心脏图标周围画圈

javascript - 如何将 javascript 脚本加载到 WordPress 中?

PHP:确定句末的句号或问号

wordpress - Youtube 短代码不显示

javascript - 使用 JS 和 CSS 使 header 仅适用于蜂窝媒体

javascript - 如何配置 Bootstrap 镜像?

html - 如何在 css 中使用 clip-path 属性作为边框

javascript - Onclick 函数在 <span> 中不起作用?