CSS实现图片垂直居中

HTML代码：

<div class="divBox">
    <img src="../images/001.jpg" alt=""> <!--图片路径需更换-->
</div>

CSS代码：

.divBox{ 
    background-color:#f8f8f8; width: 600px; height: 300px; border:solid 1px red; padding: 20px; margin:0 auto;
}
.divBox img{
    width: 300px; vertical-align: middle;
}
.divBox:before{
    display: inline-block; content: " "; height: 100%; vertical-align: middle;
}