html图片如何居中对齐(图片居中css方法)

 分类:前端问答时间:2022-08-16 07:30:02点击:

html图片如何居中对齐?css方法如下几种:

html图片如何居中对齐

1、可以在img外建立div块状标签,然后对div设定宽度,将文件居中设置 margin:0 auto

<div style="width: 300px; margin: 0 auto;">
      <img src="img/1.jpg" alt="图片">
</div>

2、将图片设置为相对定位,然后对其以百分比的方式将其居中

img {
   position: relative;
   left: 50%;
   transform: translateX(-50%);
}
除注明外的文章,均为来源:老汤博客,转载请保留本文地址!
原文地址: