要将一张图片垂直和水平居中在一个div元素中，你可以使用以下CSS样式：
div{display:flex;justify-content:center;align-items:center;}img{max-width:%;max-height:%;}
这里，display:flex;声明了div元素是一个Flexbox容器，justify-content:center;和align-items:center;使得Flexbox容器的内容垂直和水平居中对齐。img元素的max-width和max-height样式保证了图片的尺寸不会超过容器的大小，从而可以完整地显示在容器中。
另外，你也可以使用text-align:center;将图片水平居中，然后通过设置line-height与容器高度相等来使图片垂直居中。例如：
div{text-align:center;height:px;line-height:px;}img{vertical-align:middle;}
这里，text-align:center;让图片水平居中，height声明了容器的高度，line-height使得行高等于容器的高度，从而使得图片垂直居中。vertical-align:middle;则是为了解决图片与行基线对齐的问题。