您想学习将第一个和最后一个 CSS 类添加到 WordPress 菜单项吗？
CSS 指定文档的外观。此外，它还操纵网站的所有功能。您可以轻松地将自定义 CSS 添加到第一个和最后一个菜单项。如果重新排列菜单，项目既不是第一个也不是最后一个。
在本文中，我们将介绍如何向 WordPress 菜单添加类。本文最适合正在寻找添加类的方法但不知道如何操作的人。开始吧。
为什么要将第一个和最后一个 CSS 类添加到 WordPress 菜单项中？
首先，你必须对CSS有一个基本的概念。 CSS 是层叠样式表的缩写。主要用于给 HTML 内容添加样式规则。添加自定义规则后，该网站的任务是做它不习惯做的不同事情。
在您需要将一些自定义样式添加到 WordPress 中自定义设计项目的导航菜单之前。但现在您可以轻松浏览菜单并添加第一个和最后一个 CSS。当客户端重新排列菜单时会出现问题。因此，您需要以这样一种方式设计菜单，即使客户重新排列它也能正常工作。
因此，在本教程中，我们将使用代码方法来分析 CSS 类并学习如何设置它们的样式。
使用代码添加第一个和最后一个 CSS 类
这种方法是添加 CSS 类最简单快捷的方法。在这种方法中，您需要做的就是将代码添加到您的 function.php 文件中。请仔细按照以下步骤操作：
- 从安装插件开始代码片段。
- 导航到片段 >> 添加新内容。
- li>复制以下代码：
| 123456 | function wpb_first_and_last_menu_class($items) { $items[1]->class[ ] = '第一'; $items[count($items)]->class[] = 'last'; return $items;}add_filter('wp_nav_menu_objects', 'wpb_first_and_last_menu_class'); |
- 将以上代码粘贴到代码区域下方的新片段中。
- li>保存更改并激活代码。
因此，您已成功将第一个和最后一个 CSS 类添加到您的 WordPress 导航菜单中。
使用 CSS 选择器设置第一个和最后一个 CSS 的样式
另一种设置第一个和最后一个 CSS 样式的方法是使用 CSS 选择器。这种方法也很简单，但在旧版本的浏览器（如内部浏览器）中不起作用。
要遵循此方法，您需要满足要求的条件，即您必须将代码添加到主题的样式表或 WordPress 主题定制器的附加 CSS 部分。现在，按照下面提到的步骤操作：
- 导航到外观 >> 自定义。
- 单击“附加 CSS”按钮。
- li>复制粘贴以下代码：
| 12 | ul#menuid > li:first-child { }ul#menuid > li:last-child { } |
注意：menuid要替换成菜单的实际ID。此外，选择器“first-child”和“last-child”选择菜单的一个元素。
- 保存更改。
总结
我们希望本文对您有所帮助，并帮助您将第一个和最后一个 CSS 类添加到 WordPress 导航菜单。另外，请查看我们的文章“如何在不链接页面的情况下向 WordPress 菜单添加标题？”有关 WordPress 的更多信息。
如何将第一个和最后一个 CSS 类添加到 WordPress 菜单项？首次出现在 WP HowToPress – 你的 WordPress 指南。
