如何在WooCommerce产品表格中仅将父类别设置为粗体？

别用动态生成的ID选择器，这类ID每次加载都会变，完全不可靠。你得基于父类别元素的通用结构特征或类名来写CSS，以下是具体操作方法：

1. 定位父类别的通用标识 #

打开浏览器开发者工具（按F12），选中任意父类别元素，观察它的HTML结构：

• 多数场景下，父类别会带有专属类名（比如parent-term、select2-result-parent）
• 或者父类别元素内包含展开/折叠图标（比如<span class="select2-result__option-expand"></span>）
• 还有可能子类有额外的内边距缩进，父类别没有

2. 对应CSS写法 #

根据不同的结构特征，选择匹配的CSS规则：

情况1：父类别带有专属类名 #

如果父类别的li标签有类似parent-term的类，直接用类选择器：

li.select2-result__option.parent-term {
  font-weight: bold;
}

情况2：父类别包含展开图标 #

用:has()选择器匹配包含展开图标的父项（注：IE不支持，现代浏览器均兼容）：

li.select2-result__option:has(.select2-result__option-expand) {
  font-weight: bold;
}

情况3：子类有额外缩进 #

如果子类有固定的左内边距（比如padding-left: 20px），反向选择没有该样式的父项：

li.select2-result__option:not([style*="padding-left: 20px"]) {
  font-weight: bold;
}

3. 验证调整 #

把上述CSS添加到主题自定义CSS区域，刷新页面后检查父类别是否加粗。如果没生效，回到开发者工具重新确认父类别元素的特征，调整选择器即可。

内容的提问来源于stack exchange，提问作者Chris Rontos