为了账号安全,请及时绑定邮箱和手机立即绑定

怎么设置中间的文字能随着长度的变化而自动垂直居中

怎么设置中间的文字能随着长度的变化而自动垂直居中

喵喔喔 2018-11-15 11:10:12
查看完整描述

1 回答

?
慕码人8056858

TA贡献1803条经验 获得超6个赞

直接设置上下相同的padding就可以了, 可以在任何浏览器上运行,并且代码很简单,只不过这种方法应用的前提就是容器的高度必须是可伸缩的。。而高度变化正好是题主的要求。demo:

<!DOCTYPE html>

<html>

<head>

     <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Document</title>

    <title> 多行文字实现垂直居中 </title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <style type="text/css">

        .tx-verti-center{

            padding: 25px;

            border: 1px solid #FF0099;

            width: 760px;

        }

    </style>

</head>


<body>

    <div class="tx-verti-center">

        现在我们要使这段文字垂直居中显示!阿萨德黄金卡撕掉会阿萨德卡时间段卡拉胶考虑到静安寺来看待

            阿萨德黄金卡撕掉会阿萨德卡时间段卡拉胶考虑到静安寺来看待

            阿萨德黄金卡撕掉会阿萨德卡时间段卡拉胶考虑到静安寺来看待

        

        

    </div>

    <div  class="tx-verti-center">

        现在我们要使这段文字垂直居中显示!阿萨德黄金卡撕掉会阿萨德卡时间段卡拉胶考虑到静安寺来看待

          

        

        

    </div>



</body>

</html>



查看完整回答
反对 回复 2018-12-06
  • 1 回答
  • 0 关注
  • 786 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号