移动端 行与行 间距

Question

如图 移动端显示三行字 标注很清楚 如何精确的显示？
以前的做法
文本统统设置成line-height：1 然后间距以此设置为28px 20px 20px，但问题是 在设备上有时候个别字体往往显示被挤压，或者有英文就不能完全显示 ，如果‘g’。
如果不设置line-height默认不设置，或者设置更大值, 比如下图 50px字体 站位56px，font-size越小，上下间隙越小，font-size越大，上下间隙越大。那么标注的28px距离就肯定不是28px，那应该是多少？所以说怎么样才能精确还原设计稿。 想知道大家工作的时候都是怎么处理的

asdfasfsafd

Answer 1

用预处理css吧 把字体的大小当作变量传到mixin中然后行高设为 $fontsize+固定值

Answer 2

谢邀。
我自己的习惯，多行文字才会用line-height，多个单行这种我一般是用margin和padding要多些，像题中这种，我可能会写多个<p>标签，然后加上margin-bottom: 20px;，然后父元素给个padding-top: 28px;。