div层中图片垂直居中的css样式_html/css_WEB-ITnose

1、图片定义大小
.div{ border:1px solid #000;width:200px;
    height:200px;position:relative;
}
.img {
    position:absolute;
    top:50%;
    left:50%;
    margin:-50px 0 0 -50px;
    width:100px;
    height:100px;
    border:1px solid red;
    }

2、图片不定义大小           

固定高宽的容器中，图片垂直局中。

   

---

   

---