一，文字垂直居中vertical-align:middle;
1.为什么没效果呢？
one.png
two.png
因为vertical-align属性只对行内元素有效
2.为什么设置(display:inline-block;)还是没效果呢？
yi.png
er.png
因为将只是将对象呈递为内联对象，但是对象的内容还是作为块对象呈递。说的通俗点，就是你设置的当前div属性还是块对象呈递，但是允许同一级别的div在同一行内，也可以设置宽度和高度！
3.设置display:table-cell，将块元素转化为单元格
2.png
3.png
二，文字两端对齐(text-align:justify)
注意：text-align不会处理被打断的行和最后一行。如果文字只占了一行，也就是最后一行了，text-align设置为justify不会产生任何效果
1.png
tu.png
解决办法：
1.加span空标签
span是inline-block，设置宽度100%，那么这个时候span+文字的宽度就超过行盒了，浏览器会将其拆成两行。
one.png
two.png
2.加after
3.png
two.png
参考链接（https://www.cnblogs.com/tangchangcai/p/7774056.html ）
参考链接（https://blog.csdn.net/zhuobin_tian/article/details/70169664）
网友评论