想使用A 标签内的文字垂直居中时，必须设置a标签的display为 block才可以实现。同时设置高度和宽度。示例代码如下：

<style type="text/css">
.div{
    width: 100px;
    height: 60px;
background-color: green;
}
.demoa{
display: block; 
    width: 100px;
    height: 60px;
    line-height: 60px;
    text-align: center;
}
</style>

<div class="div">
<a class="demoa" href="https://lebang2020.cn" target ="_blank">乐帮网首页</a>
</div>

 

 

乐帮网首页

 

 

 

原理说明

a 标签默认是行内元素，设置宽高不生效；改为 display:block（或 inline-block、flex）后，宽高才会起作用。

  • 水平居中：text-align: center。
  • 垂直居中：单行文本可用 line-height 等于容器高度；多行或高度不确定时建议用 flex（父容器 display:flex; align-items:center; justify-content:center）。
  • 父元素需有明确高度，子元素才谈得上"撑满"。

相关阅读

参考资料