html - 居中对齐图像

Question

我正在尝试将此图像对齐在页面的中心。我试过“（在正文中）”“text-align:center; 和 display:inline-block;（在 css 中）”但它们不起作用。

这是 JSFiddle：http: //jsfiddle.net/4TtHR/1/

这是CSS：

figure {
  display: inline-block;
  position: relative;
  float: left;
  overflow: hidden;
  margin: 0 20px 20px 0;
}

score 1 · Accepted Answer

1

figure {
display: block;
position: relative;
overflow: hidden;
margin: 0 auto;
width: 50%;
}

于 2013-10-20T02:02:25.473 回答

score 1 · Accepted Answer

您正在尝试使浮动元素居中。

您可以简单地将其包装在 a 中div，将其设置为display:inline-block以包含子元素。然后应用text-align:center到parent以使居中div。

2 回答 2