css 多行文字垂直居中

最新推荐文章于 2023-02-28 22:13:56 发布

weixin_30321709

最新推荐文章于 2023-02-28 22:13:56 发布

阅读量39

点赞数

原文链接：http://www.cnblogs.com/silences/p/7016281.html

版权

实现多行文字垂直，水平居中

重点代码

 text-align: center;
 display: table-cell;
 vertical-align: middle;

  <div class="sign_up">
        <p>报名</p>
        <p>sign up</p>
 </div>

.sign_up {
    width: 5rem;
    height: 5rem;
    font-size: 1rem;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    color: #ffffff;
    background: #4472BD;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.20);
}