2

我的意思是不使用任何其他标签......只有一个标签和它的 CSS。

所以

http://jsfiddle.net/EqTsu/

<style>
  #test{
      width: 100px;
      height: 100px;
      text-align: center;
      border: solid 1px #ff0000;
    }
</style>

<div id='test'>foo</div>

需要什么垂直居中？

根据下面的答案

它需要

  display: table-cell;
  vertical-align: middle;
4

3 回答 3

2

有一种 hack-ish 变通方法，你先给出<div>属性display: table-cell;，然后给出vertical-align: middle;属性，是的。

所以完整的 CSS 将是：

#test{
  display: table-cell;
  vertical-align: middle;
  width: 100px;
  height: 100px;
  text-align: center;
  border: solid 1px #ff0000;
}

此外，外部样式表是您的朋友。

于 2012-08-02T18:25:04.807 回答
1

这是使用您的代码的 jsFiddle：

http://jsfiddle.net/EqTsu/2/

添加display: table-cell;将导致元素被视为表格中的单元格，然后您可以使用表格格式 CSS vertical-align: middle;。

于 2012-08-02T18:27:51.887 回答
1

了解垂直对齐，或“如何（不）垂直居中内容”

于 2012-08-02T18:29:07.000 回答