1、新建html页面，并在页面上添加div，为了区分明显已对div设置了边框。效果如图所示
2、方法1：设置行高（line-height）和垂直（vertical-align）对齐方式让div的内容垂直居中。效果如图
3、方法二：设置内边框（padding-top）让div里内容垂直居中。
需注意：由于padding-top会把div增高，所以使用时需要把div的高度相应的减少。 效果如图：
4、对应代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>div里内容垂直居中</title>
<style type="text/css">
div{ margin-bottom:5px;}
.mar{ margin:0 auto; width:800px; border:1px solid #e7e7e7; height:300px; padding:15px;}
#first{
height:60px;
border:1px solid #69F;
line-height:60px;
vertical-align:middle;
}
#second{
height:40px;
border:1px solid #F96;
padding-top:20px
}
</style>
</head>
<body>
<div class="mar">
<div id="first">我是line-height设置内容垂直居中的</div>
<div id="second">我是padding-top设置内容垂直居中的</div>
</div>
</body>
</html>
