在HTML中,要让文本居中显示图片,可以使用以下方法:
. 使用CSS样式:可以通过CSS样式来实现文本和图片的居中显示。可以给文本所在的容器添加样式,设置其居中显示,然后再设置图片的样式,使其在容器中居中显示。
```html
<!DOCTYPE html>
<html>
<head>
<style>
.container {
text-align: center; / 文本居中显示 /
}
.container img {
display: block;
margin: 0 auto; / 图片居中显示 /
}
</style>
</head>
<body>
<div class="container">
<p>这是居中显示的文本</p>
<img src="example.jpg" alt="居中显示的图片">
</div>
</body>
</html>
```
. 使用Flex布局:在HTML中,可以使用Flex布局来实现文本和图片的居中显示。通过设置容器的display属性为flex,再设置justify-content和align-items属性为center,即可实现文本和图片的居中显示。
```html
<!DOCTYPE html>
<html>
<head>
<style>
.container {
display: flex;
justify-content: center; / 水平居中 /
align-items: center; / 垂直居中 /
height: 00px; / 设置容器高度 /
}
</style>
</head>
<body>
<div class="container">
<p>这是居中显示的文本</p>
<img src="example.jpg" alt="居中显示的图片">
</div>
</body>
</html>
```
通过以上方法,可以在HTML中实现文本和图片的居中显示。无论是使用CSS样式还是Flex布局,都可以轻松实现文本和图片的居中效果。