在HTML中，让图片居中的方法有很多种，这里我将介绍几种常见的方法，包括使用CSS样式、使用HTML5的<center>标签、使用<table>标签等。
1、使用CSS样式
我们可以使用CSS样式来控制图片的居中显示，我们需要在HTML文件中引入一个<style>标签，然后在其中编写CSS样式，接下来，我们将图片的display属性设置为block，并为其添加margin: auto;属性，以实现水平居中，我们还需要设置图片的宽度和高度。
示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
img {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
height: auto;
}
</style>
</head>
<body>
<img src="your-image-source.jpg" alt="图片描述">
</body>
</html>
2、使用HTML5的<center>标签
HTML5提供了一个名为<center>的空元素，用于将文本内容居中显示，这个标签并不适用于图片，我们不能直接使用<center>标签来让图片居中，我们可以将图片放在一个包含<center>标签的段落中，从而实现图片的居中显示。
示例代码：
<!DOCTYPE html> <html> <body> <p style="text-align: center;"> <img src="your-image-source.jpg" alt="图片描述"> </p> </body> </html>
3、使用<table>标签
我们还可以使用<table>标签来实现图片的居中显示，我们需要创建一个表格，并将图片放置在表格的一个单元格中，我们可以为表格设置border-collapse: collapse;属性，以消除表格边框之间的间距，我们将表格的宽度设置为100%，并将其居中显示，这样，图片就会在表格中居中显示。
示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
table {
border-collapse: collapse;
width: 50%;
margin: auto;
}
td {
text-align: center;
vertical-align: middle;
}
</style>
</head>
<body>
<table>
<tr>
<td><img src="your-image-source.jpg" alt="图片描述"></td>
</tr>
</table>
</body>
</html>
4、使用flex布局
我们还可以使用flex布局来实现图片的居中显示，我们需要在HTML文件中引入一个<style>标签，然后在其中编写CSS样式，接下来，我们将父元素的display属性设置为flex，并为其添加justify-content: center;属性，以实现水平居中，我们还需要设置父元素的宽度和高度，这样，子元素（即图片）就会在父元素中居中显示。
示例代码：
<!DOCTYPE html>
<html>
<head>
<style>
.container {
display: flex;
justify-content: center;
width: 50%;
height: auto;
}
</style>
</head>
<body>
<div class="container">
<img src="your-image-source.jpg" alt="图片描述">
</div>
</body>
</html>
在HTML中，有多种方法可以实现图片的居中显示，我们可以使用CSS样式、HTML5的<center>标签、<table>标签以及flex布局等方法，这些方法各有优缺点，可以根据实际需求选择合适的方法来实现图片的居中显示。