div 内容居中

div大小一定,内容如下:
1.一个img标签
2.多个p标签

一个img标签

主要使用模拟table方式

**html**
<div id="d">
    <div>
        <img id="img"  src="../images/飞机.png">
    </div>
</div>

**css**
#d{
    width: 60%;
    height: 300px;
    background: darkblue;
    display: table;
}
#d div{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
#img{
    width: 40%;
}

多个p标签

主要使用模拟table方式

<div id="d2">
    <div>
        <p>它同样适合一行或几行文字垂直居中</p>
        <p>它同样适合一行或几行文字垂直居中</p>
        <p>它同样适合一行或几行文字垂直居中</p>
    </div>
</div>

#d2{
    margin-top: 10px;
    width: 60%;
    height: 300px;
    background: darkblue;
    display: table;
}
#d2 div{
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}