在網頁開發中，經常會用到圖片的插入，但有時候會發現圖片沒有居中，這時候我們需要使用css來解決這個問題。
首先要明確的是，圖片居中需要設置父元素的樣式，而不是圖片本身的樣式。我們可以給父元素添加一些樣式來實現圖片居中。
下面就來看看具體的實現方法。
首先，我們需要確定圖片的父元素的寬度和高度。如果父元素是一個塊級元素，則默認寬度為100%，高度為0，我們需要手動設置寬度和高度。
然后，我們需要使用text-align屬性來實現水平居中，vertical-align屬性來實現垂直居中。
最后，我們也可以通過設置父元素的display屬性為flex來實現圖片的居中。
下面是代碼示例：

<style type="text/css">
.container{
width: 500px;
height: 500px;
margin: 0 auto;
text-align: center;
vertical-align: middle;
display: flex;
justify-content: center;
align-items: center;
}
.container img{
/* 設置圖片樣式 */
}
</style>
<div class="container">
<img src="example.jpg" alt="example">
</div>

在上述代碼中，我們將圖片放在一個類名為.container的父元素中。我們通過設置父元素的樣式，實現了圖片的水平和垂直居中。其中，通過設置display為flex，我們還實現了以下兩個效果：
1. 讓父元素內的元素都變成了彈性盒子。
2. 使用justify-content和align-items屬性來設置模式中的主軸和側軸對齊方式。這里的主軸和側軸分別為水平方向和垂直方向。
綜上所述，使用css來實現圖片居中非常簡單，只需要設置圖片的父元素樣式即可。代碼實現也非常簡單，只需要使用css的基本屬性即可。