CSS line-height配合text-align使文字居框中间显示

竖向居中：

line-height控制间距，即字符每行占位宽度，字符会居占位宽度中显示，将line-height 设置成300px;即充满整个边框

<div style="height: 300px;width: 300px;border: gray solid">
    <p style="line-height: 300px;margin: 0;">123</p>
</div>

横向居中：

将text-align设置成center

<div style="height: 300px;width: 300px;border: gray solid">
    <p style="margin: 0;text-align: center">123</p>
</div>

 

两者结合效果：

<div style="height: 300px;width: 300px;border: gray solid">
    <p style="line-height: 300px;margin: 0;text-align: center">123</p>
</div>