CSS樣式可以幫助我們在網頁中實現豐富的效果和美化頁面的功能。其中，圖片居中是一個常見的需求。下面，我們來學習如何使用CSS樣式設置圖片居中。

/*樣式代碼*/
.img-center {
display: flex;
justify-content: center;
align-items: center;
}

首先，我們使用了一個class名叫做“img-center”。它的作用是讓所有加了這個class名字的圖片都實現居中效果。

接下來，我們使用了Flexbox技術。它是一種用于布局的CSS模塊，可以讓我們更加輕松地管理網頁中的布局和空間分配。

其中，justify-content屬性確定了容器中內容的水平排列方式，而align-items屬性則決定了內容的垂直排列方式。在這個例子中，我們將它們都設置為“center”。

這樣，我們就完成了圖片居中的設置啦！不需要再使用其他的代碼，只需要給圖片加上這個class名，就可以自動實現居中效果。快來試試吧！