如何用CSS仅设置entry-content div内段落的行高？

我正在尝试调整WordPress页面中段落的line-height（行高），但页面存在多个<p>标签，仅需修改class为entry-content的div（页面文章区域）内的段落及列表项的行高。我的页面HTML结构如下：

<div class="entry-content">
<p style="text-align: center;">Paragraph 1</p>
<p style="text-align: center;">Paragraph 2</p>
<p>Paragraph 3</p>
</div>

请问能否通过类似如下的CSS实现该需求？

.entry-content {

p, li {
  line-height: 30px;
}
}

你写的这段CSS存在语法问题——原生CSS不支持这种嵌套写法，这种嵌套是SCSS/Less这类CSS预处理器的专属语法。如果直接放到WordPress的自定义CSS里，浏览器无法识别，不会生效。

要实现需求，正确的原生CSS写法如下：

.entry-content p,
.entry-content li {
  line-height: 30px;
}

这个写法能精准选中entry-content容器下所有的<p>和<li>元素，只修改它们的行高，不会影响页面其他区域的段落或列表项。

另外需要注意：你示例里的前两个<p>标签带有内联style属性，如果后续发现行高规则没生效，大概率是内联样式的优先级更高。这种情况下可以给行高规则加上!important来覆盖（不过建议尽量少用，优先通过优化选择器优先级解决）：

.entry-content p,
.entry-content li {
  line-height: 30px !important;
}

如果你的WordPress主题支持SCSS/Less（比如使用了相关主题框架或插件），那你原来的嵌套写法调整下格式（去掉多余空行）就能正常使用：

.entry-content {
  p, li {
    line-height: 30px;
  }
}

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