给予吧，在这一个上使用表格，使用vertical-align: middle。您可以只使用一个单行、单单元格的表，而不会感到太内疚（我对此睡得像个婴儿）。这不是世界上最语义化的东西，但是你更愿意维护什么，一个小的单格table，还是计算出确切的高度并使用负边距进行绝对定位？

如果知道要居中的元素的高度，则可以执行以下操作：

img {
  display: block;
  height: 500px;
  position: absolute;
  top: 50%;
  margin-top: -250px; /* 50% of your actual height */
}

我只知道一个办法：

#mydiv {
   position: fixed;
   top: 50%;
   left: 50%;
   width: 100px;
   height: 100px;
   margin-top: -50px;
   margin-left: -50px;
}

这是针对x轴和y轴的-但是必须为每个元素更改宽度/高度和边距。我讨厌它：-）
此外，如果元素大于浏览器窗口，则会出现问题。

最著名的方法是使用绝对定位。您将顶部金额设置为50%，然后将边距顶部设置为元素的负一半。

#main {
    position: relative;
}
#main img {
    position: absolute;
    top: 50%;
    margin-top: -(half your image height)px;
}

下面是使用vertical-align的变体
http://jsfiddle.net/audetwebdesign/r46aS/
它有一个缺点，即您需要为line-height指定一个值，该值还将定义包含元素的高度，该元素的作用类似于视口（用蓝色边框表示）。

注意：您可以通过设置body或html元素的高度（100%）来解决窗口高度问题，但您需要尝试一下（参见第3篇参考文献）。

然而，好的一面是，您不必根据图像的尺寸进行一些数学运算。
以下是一些与垂直对齐相关的参考资料：
http://css-tricks.com/what-is-vertical-align
http://blog.themeforest.net/tutorials/vertical-centering-with-css
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
有时候我必须记住基本的东西，所以我重读：
http://www.w3.org/TR/CSS21/visudet.html
这可能不能解决OP的问题，但在其他上下文中可能有用。

在我的样式表中使用#menu img { vertical-align: middle; }对于最新版本的FireFox、Opera、Safari和Chrome都很好用，但在IE9中就不行了。我必须手动添加style="vertical-align: middle"到每一行img代码。例如：

<li><a href="../us-hosts.php">
    <img src="../images/us-button.png" width="30" height="30"
         alt="US Hosts" style="vertical-align: middle;"/>&nbsp; US Hosts</a>
</li>

试试这个CSS：

margin-top:auto;
margin-bottom:auto;
display:block;

答案有点过时了，所以这里有一个更现代的解决方案：

display: flex;
align-items: center;