在網頁設計中，設置圖片在頁面中居中顯示是非常常見的需求。今天我們來講一下如何使用CSS來實現圖片居中的效果。
首先，我們需要在HTML中插入一張圖片。代碼如下所示：
<img src="“image.jpg”" alt="圖片" />接下來，我們使用CSS來設置圖片的樣式。使用text-align屬性來水平居中圖片，并使用vertical-align屬性來垂直居中圖片。代碼如下所示：
p {
text-align: center;
}
img {
display: inline-block;
vertical-align: middle;
}這段CSS代碼的意思是讓p元素中的文本居中顯示，同時設置img元素為行內元素，并使用垂直居中的方式將其居中顯示。
最后，我們來看一下完整的HTML代碼：<html>
<head>
<style>
p {
text-align: center;
}
img {
display: inline-block;
vertical-align: middle;
}
</style>
</head>
<body>
<p>
<img src="“image.jpg”" alt="圖片" />
</p>
</body>
</html>這段代碼可以讓圖片在網頁中水平和垂直居中顯示。這樣可以讓頁面看起來更加美觀和專業化。
總結：
在CSS中設置圖片居中的方法其實很簡單，只需要使用text-align和vertical-align屬性就可以輕松實現。所以，如果你希望你的網頁看起來更加專業，那么趕緊學習一下這個簡單而又實用的技巧吧！