div 里面内容水平垂直居中

时间：2019-11-24 19:30:14 阅读：58 评论：0 收藏：0 [点我收藏+]

标签：居中 png 一个 image width isp main mamicode display

css

.main{
    background: #999999;
    width: 600px;
    height: 400px;

    /*采用flex方式*/
    display: flex;
    /*div内容垂直居中*/
    align-items: center;
       
    /*div内容水平居中*/
    justify-content: center;
    text-align: justify;
}

html

<body >
<div  class="main">
    <!-- 居中的内容需要使用一个div包含 -->
    <div>
    <p>测试测试测试</p>
    <p>测试测试测试</p>
    <p>测试测试测试</p>
    </div>
</div>

效果图如下
技术图片

div 里面内容水平垂直居中

标签：居中 png 一个 image width isp main mamicode display

原文地址：https://www.cnblogs.com/linhuaming/p/11923455.html

踩

(0)

评论一句话评论（0）