让图片居中php代码怎么写,CSS图片居中代码怎么写

为了让网站页页美观效果更好，让图片居中应该怎么做呢？css图片居中代码怎么写呢？在这里为大家分享css如何让img图片居中，并附上代码。

CSS图片居中方法一：利用display的table-cell属性值

利用display:table-cell来实现img标签图片的水平和垂直居中，还需要配合text-align: center;vertical-align: middle;来设置图片居中。

也就是在CSS样式表中添加如下样式代码：

.div{

display: table-cell; /*主要是这个属性*/

vertical-align: middle;

text-align: center;

}

如上示例的DIV样式，display: table-cell这个属性，会让DIV作为一个表格单元格显示(类似

和 )，在设置text-align: center;就会让img图片水平居中，设置vertical-align: middle;就可以让img图片垂直居中。

CSS图片居中方法二：利用弹性布局flex来设置img图片的居中

设置display: flex;实现flex弹性布局，同时设置justify-content: center;让图片水平居中对齐，设置align-items: center;让图片垂直居中对齐。

样式代码如下：

.div{

display: flex;

justify-content: center;

align-items: center;

}