[分享]css中h3标签行高怎么改不了

最近在开发网站的过程中，我发现一个很奇怪的问题 使用CSS无法改变h3标签的行高。我尝试了很多方法，但是都没能解决这个问题。 首先，我使用了常规的CSS语法 `lineheight: 30px;`来...

最近在开发网站的过程中，我发现一个很奇怪的问题 - 使用CSS无法改变h3标签的行高。我尝试了很多方法，但是都没能解决这个问题。
首先，我使用了常规的CSS语法 `line-height: 30px;`来尝试改变h3标签的行高。但是效果并不像我预期的那样，h3标签的行高并没有改变。这时候，我又尝试了使用 !important 来强制修改运行内联样式。但是这依然不起作用。
我还使用了其他一些CSS属性，比如 margin，padding 和 font-size，但是都没有改变h3标签行高的问题。
接着，我决定使用 Chrome 浏览器的开发者工具来检查h3标签的样式。令我惊讶的是，开发者工具中的标签显示行高已经修改为我想要的30px。但是在实际网站上，这个行高并没有改变。
最后，我找到了解决方案。原来问题出在h3标签的默认样式中。h3标签有一个默认的行高，使用CSS无法完全重写它。解决方案是使用另一个CSS属性 `line-clamp`。添加如下代码来代替h3标签默认行高：

h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; /* 行数 */
  overflow : hidden;
}