网页中图片的垂直居中对齐

相信很多前端开发人员都曾遇到过需要将图片设置为垂直居中对齐的经历,我刚好在之前的一个项目刚刚解决了这个问题,使用的方法非常简单,兼容性也很好。具体做法如下:

1、只需要兼容各大现代浏览器:

父元素{
  display:teble-cell;

  width:Npx;

  height:Npx;

  vertical-align:middle;
}

2、如果要兼容IE7以前的低版本IE浏览器:

  父元素{
    display:teble-cell;

    width:Npx;

    height:Npx;

    vertical-align:middle;

    *font-size:1px;

    *line-height:Npx;  /*此处的数值必须与高度相等*/
  }

 

网页中图片的垂直居中对齐,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。