使用文本对齐中心居中图像?

新手上路,请多包涵

属性 text-align: center; 是使用 CSS 使图像居中的好方法吗?

 img {
    text-align: center;
}

原文由 Web_Designer 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 298
2 个回答

这将不起作用,因为 text-align 属性适用于块容器,而不是内联元素,并且 img 是内联元素。请参阅 W3C 规范

改用这个:

 img.center {
    display: block;
    margin: 0 auto;
}
 <div style="border: 1px solid black;">
<img class="center" src ="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png?v=c78bd457575a">

</div>

原文由 Mrchief 发布,翻译遵循 CC BY-SA 4.0 许可协议

这并不总是有效……如果没有,请尝试:

 img {
    display: block;
    margin: 0 auto;
}

原文由 codecraftnap 发布,翻译遵循 CC BY-SA 3.0 许可协议

推荐问题