要将一张图片垂直和水平居中在一个

元素中，你可以使用以下 CSS 样式：

div {  display: flex;  justify-content: center;  align-items: center;}img {  max-width: 100%;  max-height: 100%;}

这里，display: flex; 声明了

元素是一个 Flexbox 容器，justify-content: center; 和 align-items: center; 使得 Flexbox 容器的内容垂直和水平居中对齐。img 元素的 max-width 和 max-height 样式保证了图片的尺寸不会超过容器的大小，从而可以完整地显示在容器中。

另外，你也可以使用 text-align: center; 将图片水平居中，然后通过设置 line-height 与容器高度相等来使图片垂直居中。例如：

div {  text-align: center;  height: 300px;  line-height: 300px;}img {  vertical-align: middle;}

这里，text-align: center; 让图片水平居中，height 声明了容器的高度，line-height 使得行高等于容器的高度，从而使得图片垂直居中。vertical-align: middle; 则是为了解决图片与行基线对齐的问题。