还在考虑 WordPress 主题中那些类、 ID 怎么命名吗？其实 WordPress 输出标签生成的代码中默认已经自动生成了一些 class 和 id，本文就一些常见的代码中的生成的样式列出来：

  • wp_nav_menu() 生成的菜单 （代码略）
  • 最外面层的 class=」menu-nav-container」
  • 无序列表 ul 样式 id=」menu-nav」 class=」menu」 如果是二级菜单则样式为 class=」sub-menu」
  • 内部列表项 li 样式 id=」menu-item-7″ class=」menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7″

说明：

1 、 class=」menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7″其实是调用了 「menu-item」 、 「menu-item-type-taxonomy」 、 「menu-item-object-category」 、 「menu-item-7」 四个样式，它们中间是用空格分开的。

2 、 「menu-item」 在这个所有菜单项是一样，「menu-item-type-taxonomy menu-item-object-category」 这个在菜单里面是不一样的，如果是这一菜单项是类别生成的就是这段代码，如果这一菜单项是调用的页面则生成的这段代码会变成 「

menu-item-type-post_type menu-item-object-page」，如果这一菜单项是自定义的则为 「menu-item-type-custom menu-item-object-custom」 。

3 、列表项中每一项 「menu-item-7」 后面的数字不一样

4 、在主题类别页当前类别的菜单项中还会多出一个 「current-menu-item」 。

  • 生成的类别列表 li 中带有 class=」cat-item cat-item-4″，其中 「cat-item」 中通用的，「cat-item-4」 后面的数字对应类别名称，文章列表页主题中如果是当前主题，还会多出 「 current-cat」 样式
  • 生成的类别列表 li 中带有 class=」page_item page-item-71″，其中 「page_item」 中通用的，「page-item-71」 后面的数字对应页面 ID

特色图像 the_post_thumbnail() 带有 class=」Thumbnail thumbnail 」

系统默认评论模板 wp-includescomment-template.php 也已经为我们添加好了对应的样式。

一些插件也会生成的特有样式代码

breadcrumb 插件 id=」breadcrumb」

get the image 插件生成的图片中 class=」attachment-100×100 wp-post-image」

其实这些命名都是有规律的，例如 「menu-item」 翻译过来就是 「菜单项」，「current-menu-item」 翻译过来就是 「当前菜单项」，如果你的英文不错的话就很简单了。

在制作主题的时候我们只要给这些已经取好名字的 class 和 id 上添加上样式属性就行了。

例如：

在导航菜单中我们可以给访问的当前类别添加不同的样式以示区分，那只需要给 「current-menu-item」 添加上不同的样式就行了。