在网页设计和开发中，图片的居中是一项常见的需求。有时候我们需要在网页中放置一张图片，并让它水平、垂直居中。在这篇文章中，我们将讨论如何通过CSS实现图片水平垂直居中。

CSS是一种样式表语言，它用于定义网页的外观和布局。通过CSS，我们可以控制元素的位置、大小、颜色和字体等样式属性。使用CSS来实现图片的居中是非常方便和有效的。

在接下来的内容中，我们将介绍两种方法来实现图片水平垂直居中。第一种方法使用CSS的position属性，第二种方法使用CSS的flexbox属性。

方法一：使用CSS的position属性

使用CSS的position属性，我们可以控制元素在网页中的位置。我们可以将一个元素相对于其父元素进行定位，从而实现元素的水平和垂直居中。

首先，让我们先创建一个HTML文档并添加一张图片：

```