有什么办法 严格执行整个段落的行高或div?
我正在使用HTML + CSS进行书籍的排版精确印刷,并且我希望每一行的高度都相同,无论行内是什么。
常见的问题是上标或文本的放大部分,在SO上的其他几个问题中(或多或少成功)了这些问题:
<sup />
tag affecting line height, how to make it consistent? 但是,这些解决方案的问题在于它们是局部的,只能解决特定的情况。我不想解决特定的问题,我想确保这些问题根本没有机会出现。我无法预先确定在整个文本中可能出现哪些不同类型的元素,因此我想确保行保持不变,而在出现问题的情况下,修复需要在其中添加行的特殊情况由于某些因素而增长。
所以以前的“解决方案”中存在的问题,尤其是:
<sup>
标签解决方案需要手动播放多种尺寸,直到正确为止。display:inline-block;
,overflow:hidden;
和vertical-align:top;
的组合将不起作用,最终行会增加。我尝试过的事情:
简而言之,请参见this JSFiddle。
我尝试应用这些CSS规则的所有组合:
display: inline-block;
(或仅inline
)overflow: hidden;
vertical-align: top;
line-height: 1px;
但是,将文本大小更改为足够大仍会导致行变大。并且添加图像(例如,图形表情符号,可能比正常线条高度高1像素),将导致线条再次变大。
我想要的: