最近在面试不停地收到了知识冲击，尤其是对于一些基础的css、html、js问题居多所以自我也在做反思，今天就css问题如何让一个子元素div块元素上下左右居中 (以下总结方法，都已得到验证)

　　情景一：一个浏览器页面中，只有一个div模块让其上下左右居中

　　　　　　　　　　　　　right:0;

　　　　　　　　　　　　　top:0;

　　　　　　　　　　　　　bottom:0;

　　　　　　备注：此处小编使用position:fixed为最佳方案，因为position：fixed定位是相对于整个浏览器页面的

　　情景二：一个父元素div，一个已知宽度、高度的子元素div(200*300)

　　　　　　解决方案： 1、positiondiv 上下布局

　　　　　　　　　　　　　{

　　　　　　　　　　　　　　top:50%;

　　　　　　　　　　　　　　left:50%;

　　　　　　　　　　　　　　}

　　情景三:一个父元素div一个未知宽度、高度的子元素div

　　　　　　　　　　　 3、flexdiv 上下布局

　　　　　　　　　　　　子级元素：{flex:1}

　　　　　　　　　　　4、translate

CSSdiv 上下布局：图片在DIV中上下左右居Φ(水平和垂直都居中)

发布时间： 17:47 来源：互联网 当前栏目：

 　　CSSdiv 上下布局实例这个例子相信很实用，让一个图片在Div容器中上下、左右都居Φ也就是水平和垂直都居中，有用吧平时遇到的机率挺高的，下面结合CSS和HTML来实现这个演示请参见代码：

　　测试效果如下：可看到圖片在Div class内水平和垂直居中：