HTML:如何让一个div中的img垂直居中

1、table表格,同时设置vertical-align:middle;
2、设置div的display:table-cell,同时设置vertical-align:middle;(不兼容IE 8
以下)
3、绝对定位居中:

div{
    position:relative;  //可以添加其它css样式
}
img{
    width:50%;
    height:50%;  //声明宽高,可用px单位
    overflow:auto;  //防止溢出
    margin:auto;
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
}

4、负外边距:

div{
     position:relative;  //可以添加其它css样式
}
img{
    width:200px;
    height:200px;  //声明宽高,不可用百分比单位
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-100px;
    margin-top:-100px;  //距离为宽高的一半
}

你可能感兴趣的:(HTML:如何让一个div中的img垂直居中)