html - 如何在跨度内居中图片？

Question

我想将图片居中放置。跨度具有 centerMe 类，但它不会影响图片。

centerMe 的标记:

.region.region-footer .centerMe{
    text-align: center;
  }

您可以在 JSFiddle 上找到此示例.

感谢您的帮助

Answer 1

这不会发生，因为 span 是一个内联元素。

text-align:center 不影响它，因为图像的总宽度和 span 的宽度完全相同。如果你给它 100% 的宽度，那么只有你会看到差异。

此外，width 属性不适用于 inline 元素，因此请将其更改为 block 或 inline-block .

将 width 添加到标记中:

.centerMe {
    width:100%;
    display:inline-block;
}

已更新 fiddle在这里。

另一种解决方案是使用任何 block 元素，如 div、p 或 section 而不是使用 跨度。