今天终于发现了一种有效的垂直居中方法（块级元素里面的块级元素居中），写了个demo试了一下。不过此方法要求父级元素和自己元素都有定位，且自己元素要有明确的高宽。demo如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
#parent{
background: #EEEEEE;
width:500px;
height:500px;
/*父节点定位可为relative,absolute,fixed*/
position:relative;
}
#child{
background: #2e6da4;
/*子节点定位为absolute*/
position:absolute;
width:400px;
height:300px;
/*设置top，left分别为为50%*/
top:50%;
left:50%;
/*设置margin-top，margin-left分别为高，宽的 负 一半*/
margin-top: -150px;
margin-left: -200px;
}
</style>
</head>
<body>
<div id="parent">
<div id="child">
</div>
</div>
</body>
</html>
截图如下：
其中原理我还需要体会一下。另外，也求其他的好方法，希望大家分享~~
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。