子菜单不复制WordPress下拉菜单中的样式

是指在WordPress网站中，当使用下拉菜单功能时，子菜单不会继承父菜单的样式。

在WordPress中，下拉菜单是通过使用CSS和JavaScript来实现的。通常情况下，子菜单会继承父菜单的样式，包括字体、颜色、背景等。然而，有时候我们希望子菜单具有独立的样式，以便更好地区分父菜单和子菜单。

为了实现子菜单不复制父菜单样式的效果，可以按照以下步骤进行操作：

打开WordPress后台，进入外观（Appearance）-> 自定义（Customize）。
在自定义选项中，找到菜单（Menus）选项，并选择你想要修改的菜单。
在菜单编辑界面中，找到子菜单的设置选项。这通常是通过将子菜单拖动到父菜单下方来实现的。
在子菜单设置选项中，你可以找到一个名为“CSS Classes”的输入框。在这里，你可以为子菜单添加一个自定义的CSS类名。
输入你想要为子菜单应用的CSS类名，并保存菜单设置。
现在，你可以在WordPress主题的CSS文件中添加自定义的CSS样式，来为子菜单设置独立的样式。

通过以上步骤，你可以实现子菜单不复制父菜单样式的效果。你可以根据自己的需求，为子菜单添加不同的样式，以便更好地展示和区分父菜单和子菜单。

腾讯云相关产品和产品介绍链接地址：

腾讯云官网：https://cloud.tencent.com/
云服务器（CVM）：https://cloud.tencent.com/product/cvm
云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
云存储（COS）：https://cloud.tencent.com/product/cos
区块链服务（Tencent Blockchain）：https://cloud.tencent.com/product/tencentblockchain

相关·内容

WordPress 技巧：在下拉菜单中添加日历

在 WordPress 下拉菜单中添加日历，如果 WordPress 的菜单是通过后台拖拉生成的，那么在当前的主题中添加如下的代码： add_filter('wp_nav_menu_items','wpjam_add_calendar...' '; } 如果菜单是手工添加的，那么在 header.php 中相应的位置添加如下代码： Calendar 最后的效果如下图所示： ----

4431 0

实用的五大WordPress下拉菜单插件推荐

实用的五大WordPress下拉菜单插件推荐 ---- 我们在使用WordPress建站的时候经常会在网站添加下拉菜单，因为添加下拉菜单具有改善网站导航、将重要内容放在首屏上、避免用户过度滚动和增强用户体验等等优势...然而WordPress网站添加下拉菜单会需要用到一些插件，本文为大家推荐实用的五大WordPress下拉菜单插件。 1....这个免费WordPress插件需要零编码技能，因此即使是初学者，也可以在其WordPress网站上添加漂亮的菜单。响应式菜单带有150多个自定义选项，因此您可以按照自己的需要创建下拉菜单。...它的富文本编辑器使您可以使用易于添加到不同文章和页面的短代码来设置自定义内容的样式。通过合并图标、图像、文本、章节等来设计菜单项。 5....任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。

2.8K2 0

删除WordPress菜单wp-nav-menu中li的class或id样式

我们都知道wordpress已经集成了一些通用的css样式，比如wp-nav-menu菜单会有很多的class，不想看到那么多的选择器，想要清净的世界要如何操作呢？...主题　　将下面的代码添加到主题的 functions.php就可以实现效果 /** * 移除菜单的多余CSS选择器 */ add_filter('nav_menu_css_class...只要不过滤它们即可，常见的当前菜单的选择器有以下4个：current-post-ancestor， current-menu-ancestor， current-menu-item， current-menu-parent...，只要将这些class加入array中就可以 /** * 移除菜单的多余CSS选择器 */ add_filter('nav_menu_css_class', 'my_css_attributes_filter...你一定会喜欢这篇文章：如何定义wordpress菜单wp-nav-menu中的ul呢

1.3K2 0

在Excel中如何建立打勾和打叉的下拉菜单？

1、点击[数据] 2、点击[数据验证] 3、点击[数据验证] 4、点击[任何值] 5、点击[序列] 6、点击[来源] 7、点击[确定]

2.4K2 0

Ant Design Pro 中点击子菜单的时候，其他菜单不自动收起来

记录一波自己在这段时间碰到的一个Ant Design Pro 的坑：每次点击菜单都会将其他菜单自动收起来，导致一系列的用户体验不佳。...后依然不管用经过各种查，官网并没有指出此设置，在我疯狂尝试后，发现如下解决方案（说起来也很简单就加一个值即可）： <ProLayout openKeys={false} // 只需要在ProLayout中

1.6K1 0

制作一个只显示特定类别的导航栏

很多博客的导航栏是显示特定的分类的，如果你也想这样做，你可以添加下面这行代码和按照你自己的想法去样式化它。...默认情况下，wp_list_categories() 产生一个嵌套的无序列表（UL），它在一个标题为“Categories”的列表元素（li）中。你可以通过 CSS 选择其莱样式化它。...Multi-level Navigation Plugin for WordPress -- 这个插件能够产生必要的代码去创建一个 Son of Suckerfish 似的横向下拉菜单，纵向弹出或者横向滑动的导航栏...你可以通过插件选项页面控制什么项目（页面，分类，存档，友情链接等等）可以显示在你的下拉菜单中。...翻译自:Most Desired WordPress Hacks: 11 Common Requests and Fixes 第四点。Leijn 也作了翻译。 ----

8892 0

WPJAM Basic 5.9 详细更新说明

，顺手做了一些简单的优化，在这些页面，全面的 AJAX操作被关闭，使得功能先不冲突。...所以就把很多操作都移到了 WordPress 后台文章列表页面，WPJAM Basic 有一块子菜单是关于文章列表的：所以我继续优化后台文章列表页面的操作交互，比如在把鼠标移到缩略图上面，会在右上角显示一个编辑图标...修复作者下拉菜单引起的参数弃用提醒如果开启「支持通过作者进行过滤」，那么就会在后台文章列表页显示文章作者下拉菜单：升级到 WordPress 5.9 之后，会报下面的提示：Deprecated:...这是因为 WordPress 5.9 在查询用户的时候，不建议使用 who 参数了，5.9 建议使用新的和权限相关的 capability，capability__in 和 capability__not_in...，我在「WPJAM」菜单的「样式定制」子菜单下新增一个选项，让你一键移除：缩略图设置支持设置多张默认缩略图之前缩略图设置的默认缩略图只支持设置一张，如果很多文章没有设置缩略图，则会显得有些单调，所以新版则增加可以设置多张缩略图

7.2K3 0

Bootstrap框架的简单使用

下面分别介绍两种样式。布局类：表格为你已经写好的HTML中的任意标签添加 .table 类即可为其赋予基本的样式。 ......Bootstrap组件 Bootstrap 自带了大量可复用的组件，包括字体图标、下拉菜单、导航、警告框、弹出框等更多功能。...以下拉菜单为例：先在官方文档复制下拉菜单的实列结构，然后修改其中组成菜单的html的内容。...应该创建一个嵌套的标签，并将图标类应用到这个标签上。图标类只能应用在不包含任何文本内容或子元素的元素上。.../bootstrap-3.3.7-dist/js/bootstrap.min.js"> 插件使用以下拉菜单为例，你可以直接在插件使用文档里面，复制下拉菜单插件的HTML结构，然后再跳转其相关的结构和内容

3.6K1 0

为 WordPress 增加按分类搜索功能并自定义外观

本文就是讲解如何在自己网站上增加一个像下图一样的分类搜索功能：增加分类搜索功能强大的 WordPress 的搜索模块，通过一定的参数来实现按照分类搜索。...WordPress 已经提供了这样一个输出网站分类目录的函数 wp_dropdown_categories ，具体使用说明可以看一下官方文档，对于本例中，我们只需要使用下面一句代码即可输出目录： <?...潜行者m 这次就是用的这种方法，下面就来介绍一下。输出对应的结构先要自己做一个结构，然后使用 CSS 进行修饰，达到你想要的下拉菜单的样式。这里我是用了两个 div 和 ul 来模拟。...其中一个表示当前的选项，另一个表示下拉菜单的内容。然后在下拉菜单里面，使用一段 php 来调用输出对应的分类目录名称和对应的目录id 。...(function(){ //省略其他代码 var currentitem = $(this).attr('id'); $('#cat').val(currentitem); }); 此外，模拟下拉菜单还应该有类似

1.3K1 0

yii2中怎么输出二级菜单，根据我自己的样式建立的二级菜单

NOT NULL COMMENT '修改时间' ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_vietnamese_ci; -- -- 转存表中的数据

6481 0

在WordPress后台菜单系统中添加Home链接

在wordpress后台如果想打开前台的话，要想先把鼠标移动到左上角菜单，然后在下拉菜单中点击“查看站点”，很是麻烦，能不能在 WordPress 后台菜单系统中添加 Home 链接呢？...将下面代码复制到 functions.php 中： function home_page_menu_args( $args ) { $args['show_home'] = true;...return $args; } add_filter( 'wp_page_menu_args', 'home_page_menu_args' ); 把首页的链接放入 WordPress 后台菜单系统的...Pages wiget 中，让用户直接拖动添加即可

7252 0

WordPress 初学者词汇表（术语解释）

默认情况下，WordPress 会自动使用您帖子的前 55 个单词作为摘录，不过您可以在创建帖子时自定义一个摘录。 Meta 不，我们不是在谈论 Facebook。...除了父主题之外，还使用子主题来显示自定义。当您想对主题（实际代码）进行核心更改时，您需要使用子主题来继续更新您的父主题。...一个流行的例子是 StudioPress 创建的 Genesis 父主题，它在网络上有大量可用的子主题。Genesis父主题包括所有核心主题功能，而子主题包括自定义样式和布局。...当您将鼠标悬停在主菜单链接上时，如果您看到其下方出现其他链接，即Dropdown Menu（下拉菜单），这是展示支持信息和链接的好方法。...在 WordPress 中，您可以非常轻松地创建菜单，并且有内置设置可以将菜单分配到特定位置（例如，主菜单、侧边栏菜单、页脚菜单等）。

7.2K2 0

WordPress子主题怎么保留修改的代码来避免升级覆盖？

WordPress子主题怎么保留修改的代码来避免升级覆盖？...答案很简单，使用WordPress子主题功能，升级后无需再次修改原主题，只需要启用并修改子主题就可以了，下面就以Ality主题为例，创建一个Ality主题的子主题。...2、将Ality主题的样式文件style.css和css目录（因为Ality主题有部分样式文件和字体图标在这个CSS目录中）及图片目录img，一起复制到新建的主题文件夹Ality-child中，也可以将之前修改过...3、打开复制过来的style.css文件，在文件头部添加：Template:Ality 这个是关键，其中的Ality名称必须与父主题文件夹名称相同，而且父主题Ality也必须与新建的子主题同在WordPress...父主题样式可以通过下面形式加载： @importurl(“../Ality/style.css”); 代码必须写在所有样式之前，也就是文件头的后面，子主题样式文件中只需添加自己修改的部分即可。

97711 0

WordPress 技巧：使用页面模板自定义 WordPress 页面

如何自定义 WordPress 页面？如果你定制或者设计过 WordPress 主题，那么你可能会遇到过这样的问题：如何让 WordPress 的页面有不同的布局或者样式呢？...下面就是详细的实现步骤：在当前使用的主题文件夹中创建一个新模板，将它命名为 about.php。然后把 page.php 模板中的内容拷贝到 about.php 文件中。...接着，找到模板文件中调用 sidebar 的函数，去掉或者注释掉它。...可能需要找到 content div 标签，并手动给它增加一个 width 样式来扩展宽度以便能够占满整个 container div 标签。...然后就是让“关于”页面使用“关于”页面模板，登陆到 WordPress 后台，创建新页面，或者编辑 about 页面（如果已经创建了），在右边，点击页面模板的下拉菜单，在下拉列表中找到“关于”，选择它并点击保存

1.3K2 0

如何设置 WordPress 文章待审核邮件通知

完成后，请从New status下拉菜单中选择”Pending review”。接下来，您需要让PublishPress 知道您要发送通知的内容类型。...因此，单击Post type复选框，从下拉菜单中选择”Posts”。如果您还希望发送其他类型的内容的通知，则您还需要检查”Pages”。接下来，您需要做的是让插件知道该通知谁。...虽然您可以单独选择需要通知的每个用户，但通知每个用户角色更简单。要通知所有编辑器，请勾选“Roles“复选框，并从下拉菜单中选择”Editor”。...]填写文章固定链接首先，您需要复制下面的行并将其粘贴到主题文本框中。...“[psppno_post title]” 待审核中然后，您需要复制下面的两段，并将其粘贴到身体文本框中。此通知是为了让您知道“[psppno_post title]”的内容待审核中。

1.7K3 0

【愚公系列】2023年11月 Winform控件专题 MenuStrip控件详解

它是一个容器控件，可以在其上添加MenuStripItem子控件，每个子控件可以表示一个菜单项或下拉菜单。...然后在MenuStrip控件上右键，选择“添加项”即可添加子控件，可以选择菜单项、下拉菜单等。...对于MenuStrip控件的事件处理，可以通过在设计器中双击相应的子控件来添加事件处理方法，或者在代码中使用事件处理程序来处理相应的事件。...("下拉菜单"); dropdownMenuItem.DropDownItems.Add("子菜单项1"); dropdownMenuItem.DropDownItems.Add("子菜单项...可以通过设置GripStyle属性来改变MenuStrip控件的显示样式，包括Visible（显示菜单栏的背景色）、Hidden（隐藏菜单栏的背景色）、Disabled（禁用菜单栏的背景色）。

5051 1

博客整体风格更改

,然后在源码中全局搜索,大概是在src/css/_partial/_post/_content.scss文件中,新增下面样式即可 letter-spacing: .05em; 添加下拉子菜单本主题不支持下拉子菜单...,hugo的子菜单形式只需要在 menu属性中加入parent属性就可以归类为某一个菜单的子菜单,属性值必须是父级的identifier 使用css添加下拉菜单样式找到custom.scss文件,将下拉菜单的样式添加进去...添加子菜单有两种方式在配置文件中添加,修改config.toml [[menu.main]] name = "搜索" weight = 400 identifier = "search" url...menu标签, (官方文档是这样,但测试后并为生效) menu: docs: parent: 'extras' weight: 20 此时,将鼠标放在有子菜单的菜单上时, 即可以呼出下面的子菜单...参考文章: css下拉菜单–菜鸟教程

5446 2

begin主题使用说明（详解教程）

当然你想可以复制上面的代码添加到你的子主题样式文件中。...不过从WP4.2中文版开始一直有个BUG，菜单页面的“显示选项”失效，到此下载修改替换文件：添加菜单项，选择一个分类或者页面，点击添加至菜单，可以多选，用鼠标向右拖动已添加的菜单项，可以形成二级下拉菜单...begin主题使用说明（详解教程）注：顶部和移动端菜单不支持二级下拉菜单，否则会错位。如果不想显示顶部的的菜单，可以新建一个空的“菜单”，然后选择这个空的“菜单”。...子分类模板首先，新建一个分类，因为这个模板不会显示父分类的文章，所以不要向里面添加文章，只需要为这个分类添加一段描述即可，否则会出现在侧边分类小工具中。其次，为这个新建的分类添加子分类。...缩略图强烈建议使用WP自带的特色图像功能，或者制作单独的小尺寸缩略图，缩略图尺寸：大于等于280px×210px，并通过自定义栏目添加，不建议使用自动获取文章中的图片作为缩略图，因为文章中的图片尺寸都比较大

4.8K4 0

Flutter TolyUI 框架#06 | 下拉菜单设计

一、下拉菜单设计思考 下拉菜单 是我曾经开发桌面端 Flutter 应用的一根骨刺，虽然 Flutter 内置了 MenuAnchor 组件支持多级菜单。...悬浮与点击的触发模式如下效果是 TolyDropMenu 的基本使用方式: 左侧案例通过悬浮展开下拉菜单，鼠标移出时会关闭菜单，但移入到浮层中时会取消关闭。...，鼠标移入时会变为禁止样式： ActionMenu(const MenuMeta(router: '03', label: '3rd menu item'), enable: false), 3.子菜单的支持与定位...TolyDropMenu 支持子菜单的悬浮展开，并且子菜单超出边界时，也会自动适应对齐方式。...另外，通过 TolyDropMenu#subMenuGap 可以配置子菜单的水平偏移间距。通过 SubMenu 来承载菜单项及子菜单数据，可以在 menus 参数中设置若干个菜单项。

2190 0

发布WordPress主题Mac osX 2.1

这款Mac osx风格的Wordpress主题，在原版基础上，经过多次调整修改，重写了部分结构及CSS,添加可以自定义的导航下拉菜单；解决与部分插件冲突问题；更换可以显示标题的flash幻灯；优化图片及代码...说明：所需插件：wp-pagenavi 使用前，删除或更名插件中的pagenavi-css.css文件主题分两个版本主要区别在侧边。...1)导航下拉菜单一级文字控制在4个字以内，也可修改下面样式值加宽 .menu a{display:block;width:54px（修改此数值）;height:30px;margin:0;} 2）顶部和侧边展示幻灯...和cat-posts-b.php文件，文件内有说明，可自行查看； 5）首页自定义图片添加方法，发表文章时在自定义窗口左侧添加 small 右侧添加图片链接地址，再次在左侧添加 link 右侧添加该日志的链接地址...； 6)页角的苹果标志是存放统计代码之用，打开footer.php添加自己的统计代码； 7)主题中保留了前一版本的独立模板，可以看2.02版说明； wp-pagenavi插件修改版下载：wp-pagenavi

6093 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云