图片和多行文本水平垂直居中

最新推荐文章于 2021-08-09 16:36:41 发布

gengyunzhao

最新推荐文章于 2021-08-09 16:36:41 发布

阅读量512

点赞数 2

文章标签：水平垂直居中

1，多行文本水平垂直居中：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>多行文本水平居中</title>
    <style>
        .box{
            width: 500px;
            height: 300px;
            line-height: 300px;
            background-color: #ccc;
        }
        .box .text{
            line-height: normal;
            display: inline-block;
            vertical-align: middle;
            text-align: left;
        }
    </style>
</head>
<body>
    <div class="box"><p class="text">多啊好股难闻文本水平居中时间到了科技服务暑假里看见了我空间里看见 就渴望交流空间发谁都放假了我就哦额就 尽快了解的实力考几分离开我立刻将法律框架看来</p></div>
</body>
</html>

2，图片水平垂直居中：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>多行文本水平居中</title>
    <style>
       .box{
           line-height: 300px;
           text-align: center;
       }
        .box>img{
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <div class="box"><img src="" alt=""/></div>
</body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

gengyunzhao

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
图片和多行文本水平垂直居中

1，多行文本水平垂直居中：html>html lang="en">head> meta charset="UTF-8"> title>多行文本水平居中title> style> .box{ width: 500px; height: 300px; line-height: 3
复制链接

扫一扫