在網頁設計中，圖片作為頁面布局的重要元素之一，往往需要設置居中顯示。那么，如何使用CSS來實現圖片的居中顯示呢？下面介紹幾種方法：

/* 第一種方法：使用text-align */
img{
display: block;
margin: 0 auto;
text-align: center;
}
/* 第二種方法：使用Flex布局 */
.container{
display: flex;
justify-content: center;
align-items: center;
}
.container img{
display: block;
}
/* 第三種方法：使用position和transform */
.container{
position: relative;
}
.container img{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

以上三種方法都能實現圖片的居中顯示，具體使用哪種方法，可以根據具體的設計需求和布局情況來選擇。在這里就不再過多講解每種方法的具體實現原理，需要更多學習CSS的同學可以深入了解。