在html中，可以使用text-align属性设置居中显示图片，只需要给图片元素设置“text-align:center”即可。text-align属性规定元素中图片的水平对齐方式，当值为center时，表示把图片排列到中间。
本教程操作环境：windows7系统、CSS3&&HTML5版、Dell G3电脑。
然后我们需要在body部分新建一个div标签，并在其中插入一张img图片。并给div添加简单的css样式。
![0RK7H%FJ35@5QE@]TOW4H0F.jpg](https://cdn.chuangxiangniao.com/www/2025/12/1620986827922658.jpg "1620986827922658.jpg")
然后我们在浏览器中查看效果，可以发现图片是默认左对齐的，并没有在div的正中央显示。
立即学习“前端免费学习笔记（深入）”；
此时为图片添加居中属性也是没有用的，我们需要将图片套在一个p或者span标签中，给标签添加一个text-align:center属性。
这样修改之后，我们再次回到浏览器中刷新页面，可以看到图片已经是在div中居中显示了。
推荐学习：html视频教程
以上就是html如何设置居中显示图片的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1549461.html
微信扫一扫 
支付宝扫一扫 
