WordPress TwentyTen菜单:如何在特定位置选择CSS子菜单？

Question

我正在设计WordPress TwentyTen主题的顶部菜单。

我希望第一个菜单项的所有子菜单都宽200 to，

第二个菜单项的所有子菜单宽度为250 of，

以及第三个菜单项的所有子菜单宽度为300 of。

例如，菜单具有以下结构：

关于

• History

• People

• 任务

服务

• Service1
• Service2
• Service3

产品

• Product1
• Product2
• Product3

我希望所有的项目下即将是200 be宽，所有的项目下的服务是250 be宽，所有项目下的产品是300 be宽。

如何仅使用CSS在WordPress中选择它们？(考虑到菜单是动态生成的，而且报头只有wp_nav_menu命令？)

Answer 1

假设您使用的是在外观/菜单管理界面页面下定义的自定义菜单结构，您可以从那里向每个子菜项添加CSS类。

转到管理页面，然后在顶部选择“屏幕选项”。在这里，您将在“显示高级菜单属性”下找到一系列滴答框。其中之一是"CSS类“。在选中该框后，您会发现每个子菜单选项窗格现在都有一个"CSS类(可选)“文本框，您可以在其中添加一个或多个类。

一旦完成了，你就可以尽情地满足.

Answer 2

使用与每个级别匹配的css选择器。如下所示：

#access ul {
   width: 200px;
}
#access ul ul {
   width: 250px;
}
#access ul ul ul {
   width: 300px;
}