文章中图片居中显示的css代码

我们在网站中更新文章时，很多时候都会插入图片美化文章，提高文章的用户体验，图片在文章中一般是以标签插入在文字中，虽然在后台编辑时可以将图片居中，但是每篇文章中这样做显然比较麻烦。我们可以使用CSS代码控制img标签的样式，使图片居中，这样可以减少我们的操作动作。那么在html中，让图片居中显示的CSS代码是什么呢?

其实很简单。css代码如下：

img {

max-width: 100%;

height: auto;

display: block;

margin:0 auto;

}

在上面的代码中，display:block将图片设置为块级元素，这样可以占据整个上级元素宽度。margin:0 auto;是让img元素居中的代码，这行代码同样是网页布局中，整体居中的代码。前面的0是img离上下内容的距离，可以修改为需要的数值，后面的auto不能更改。