关于css:单行文字垂直居中

html构造：

<div class="pay">   立刻领取 ￥XXX</div>

css代码：

.pay{    position: fixed;    left: 0;    bottom: 0;    width: 100%;    height: 44px;    font-size: 17px;    font-weight: bold;    color: #080304;    background: #F7B529;    border-radius: 6px;    text-align: center;}

解释：
line-height与里面的height的高度一致
height: 44px;
line-height: 44px;

html构造：

<div class="pay">    <p class="txt">立刻领取 ￥XXX</p></div>

css代码：

.pay{    position: fixed;    left: 0;    bottom: 0;    width: 100%;    height: 44px;    font-size: 17px;    font-weight: bold;    color: #080304;    background: #F7B529;    border-radius: 6px;    text-align: center;    display: table;     }.pay .txt{    display: table-cell;    vertical-align: middle;}

解释：
父元素display: table;
子元素
display: table-cell;
vertical-align: middle;

html构造：

<div class="pay">    <p class="txt">立刻领取 ￥XXX</p></div>

css代码：

.pay{    position: relative;    left: 0;    bottom: 0;    width: 100%;    height: 44px;    font-size: 17px;    font-weight: bold;    color: #080304;    background: #F7B529;    border-radius: 6px;    text-align: center;}.pay .txt{    position: absolute;    top: 50%;    transform: translateY(-50%);    width: 100%;}

文字定宽才有成果，否则如果去计算的话，此办法不佳，则不倡议应用