WooCommerce产品描述标签页内H4及段落字体大小调整求助

问题说明 #

需调整WooCommerce站点产品详情页的描述标签页内H4标签及段落文本的字体大小，当前仅能修改颜色，调整大小操作无效。已尝试多段带!important的CSS代码，要么误影响全站文本，要么完全无效果。

无效代码的核心问题 #

之前的代码大多未精准定位到标签页内部的内容区域，而是针对产品列表、分类导航或标签标题等其他元素：

• .woocommerce .tabs .h4：错误将H4标签当作类选择器（应为h4而非.h4），且未限定标签页内容范围
• p { font-size: 32px !important; }：全局修改所有段落，并非仅针对产品标签页内容
• .product-category h4、.woocommerce ul.products li.product .description等：均指向产品列表页元素，与详情页标签内容无关

正确的CSS解决方案 #

使用精准选择器定位产品详情页标签内的目标元素：

调整标签页内H4字体大小 #

/* 产品描述标签页内的H4标签 */
.woocommerce div.product .woocommerce-tabs .panel h4 {
    font-size: 32px !important;
    /* 可选：添加字体粗细等额外样式 */
    font-weight: bold;
}

调整标签页内段落文本字体大小 #

/* 产品描述标签页内的所有段落 */
.woocommerce div.product .woocommerce-tabs .panel p {
    font-size: 18px !important;
    /* 可选：调整行高提升可读性 */
    line-height: 1.6;
}

通用调整（标签页内所有文本） #

若需统一调整标签页内所有文本（含H5、列表等其他元素），可使用宽泛选择器：

.woocommerce div.product .woocommerce-tabs .panel * {
    font-size: inherit; /* 或指定具体数值，如16px */
}

验证生效步骤 #

1. 将代码添加至主题的自定义CSS（路径：外观 → 自定义 → 额外CSS）
2. 打开产品详情页，刷新后检查标签页内的文本大小
3. 若仍不生效，右键检查元素，确认选择器是否匹配当前页面的DOM结构（部分主题可能修改标签页类名）

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