h5移动端line-height字体偏上问题

本篇文章记录一下在h5开发时用line-height导致字体偏上的问题,尤其是安卓手机.

解决这个问题我总共有4个方案.

代码

<a target="_blank" href="/aaa.html" class="btn">这是按钮</a>

这里的整理两个效果明显的方案

方案一:用flex布局

display: inline-flex; 
justify-content: center;
align-items: center;

方案二: display: table-cell; 布局

<a target="_blank" href="/aaa.html" class="btn">
<span style="  display: table-cell;  vertical-align: middle; height: inherit;">这是按钮</span>
</a>