html 中图片水平竖直居中对齐

 div {
 *float:left;
 width:300px;
 height:300px;
 
 overflow:hidden;
 position:relative;
 display:table-cell;
 text-align:center;
 vertical-align:middle;
 margin-left:20px;
 }
div p {
 position:static;
 +position:absolute;
 top:50%
 }
img {
 position:static;
 +position:relative;
 top:-50%;left:-50%;
 }

 

  • html 中图片水平竖直居中对齐_第1张图片

  • html 中图片水平竖直居中对齐_第2张图片

 

 

你可能感兴趣的:(html,div,float)