html - 在 css 或 html 中居中图像

Question

我试图在我的页面上将此图像居中，但我不知道该怎么做： http: //grab.by/nBca

我正在使用的代码是这样的：

<div class="dronevollelengte">
   <img src="http://www.quirk.be/wp-content/uploads/2013/06/drakdrone.jpg"
        text-align: center/>
</div>

Answer 1

您需要将该text-align: center部分放在 div 的样式属性中。您不能简单地将它放在属性之外的 HTML 中。

<div class="dronevollelengte" style="text-align: center"><img src="http://www.quirk.be/wp-content/uploads/2013/06/drakdrone.jpg" /></div>

或者，在 CSS 文件中使用它并将其附加到类：

.dronevollelengte {
    text-align: center; 
}

Answer 2

您可以改为设置 div 样式。在你的 CSS 中添加：

.dronevollelengte {
    margin:0 auto;
}

这会将顶部和底部设置margin为 0，将左侧和右侧margin设置为自动...这将使div. 所以为它提供一个是明智的width。

检查这个 jsFiddle以获得一个工作示例。