关于a标签的水平和垂直居中的tips（垂直部分有误待改进）

关于a标签的水平和垂直居中的tips

例：

html：

<div class="leftaside">
    <ul>
        <li><a href="#">生意贷</a></li>
        <li><a href="#">生意一卡通</a></li>
        <li><a href="#">特色创新功能</a></li>
    </ul>
</div>

css：

.leftaside ul li{
    height:30px;
    text-align: center;
}
.leftaside ul li a{
    font-size:12px;
    vertical-align: middle;
    color:#000;
}

方法如下：

水平居中：在a标签的父级标签内使用text-align:center，不能在a标签中使用。因为text-align只能用于块级标签。如果非要在a标签使用text-align，那么需要a标签添加dispaly:block。但如果这样，vertical-align（用来指定行内元素（inline）或表格单元格（table-cell）元素的垂直对齐方式）将无效。所有最好的方式是在父级标签li标签中添加text-align。

参考文档：

1.https://blog.csdn.net/seaalan/article/details/89671543 CSS - 行内元素水平居中

2.https://developer.mozilla.org/zh-CN/docs/Web/CSS/vertical-align

3.https://developer.mozilla.org/zh-CN/docs/Web/CSS/text-align