如何选择无Class、ID的div元素并通过CSS隐藏？

针对你这种目标元素没设Class或ID的情况，直接用下面几种CSS方案就能精准定位并隐藏内容，把代码复制到WordPress的「外观 > 自定义 > 额外CSS」里保存即可生效：

方案1：子元素索引定位 #

利用nth-child()选择器，根据目标元素在父容器里的位置定位：

#shop .products .product .summary-bottom div:nth-child(3) {
    display: none;
}

说明：你的目标div是.summary-bottom容器里的第3个子元素，这个选择器能直接选中它。

方案2：内联样式属性匹配 #

目标div带有style="color: red;"的内联样式，直接通过属性选择器匹配：

#shop .products .product .summary-bottom div[style="color: red;"] {
    display: none;
}

说明：精准度高，但要注意内联样式代码必须完全匹配（包括空格），后期样式修改可能会导致失效。

方案3：相邻兄弟元素定位 #

用兄弟选择器选中紧跟在form元素后的div：

#shop .products .product .summary-bottom form + div {
    display: none;
}

说明：只要目标div始终在form元素后面，这个选择器就会生效。

额外提示 #

• 若不想彻底移除元素占用的空间，可把display: none换成visibility: hidden（元素仍占位置）或opacity: 0（视觉隐藏但可交互）。
• 确保选择器层级足够深，避免误隐藏页面上其他结构类似的元素。

内容的提问来源于stack exchange，提问作者Harish Kumar