昨天在做项目的时候，遇到一个图片水平垂直居中的问题，要解决这个问题笔者想到了一个很简单的办法。
首先我们把页面的框架做出来，上代码：
<html><head><title>图片水平垂直居中</title><style>.my_div{width:1000px;height:700px;border:1pxsolidred;position:relative;}.my_img{display:block;width:400px;height:300px;position:absolute;left:50%;//绝对定位让图片距离左边50%top:50%;//同上margin-left:-200px;//还要减去图片宽度的一半margin-top:-150px;//同上}</style></head><body><divclass="my_div"><imgclass="my_img"src="weixin.png"/></div></body></html>
这样就实现了我们的要求了，大家仔细看嵌入到里边的css代码，不难发现，我把图片采用了绝对定位，让它的left和top都等于50%，但是这并不意味着图片就水平和垂直居中了，此时可以巧妙的才用负的margin（可能有很多小朋友还不知道margin有负的这种写法，不懂就问度娘吧）来减去图片宽高的一半，然后，目的就达到了，是不是 so easy 啊！
举一反三：不仅仅只适用于图片外边是div（盒子）的模型，还可以相对于整个窗口居中，都是类似的（让图片position:fised；就OK了）
