在網(wǎng)頁中，表格是非常常見的元素之一。而表格中插入圖片也是很普遍的需求。但有時(shí)候會(huì)遇到圖片不居中的情況，這時(shí)我們就需要使用CSS來設(shè)置圖片的位置。 首先，讓我們來看一下如何設(shè)置圖片水平居中。我們可以使用 text-align 屬性來實(shí)現(xiàn)：

table {
text-align: center;
}

這個(gè)CSS代碼可以將表格中的所有內(nèi)容水平居中。但是，如果只想讓圖片居中而其他元素不受影響，可以將圖片放置在一個(gè)單獨(dú)的單元格中，并將該單元格居中：

td img {
display: block;
}
td {
text-align: center;
}

這個(gè)CSS代碼將圖片設(shè)置為塊元素，使其可以占據(jù)整個(gè)單元格的寬度，并將單元格水平居中。 接著，我們來看一下如何設(shè)置圖片垂直居中。我們可以使用 vertical-align 屬性來實(shí)現(xiàn)：

td {
vertical-align: middle;
}

這個(gè)CSS代碼將單元格中的內(nèi)容垂直居中。但是，由于圖片是行內(nèi)元素，可能會(huì)存在一些額外的空隙。因此，我們需要將圖片轉(zhuǎn)換為塊元素，并將其高度設(shè)置為與單元格相同：

td img {
display: block;
height: 100%;
}

這個(gè)CSS代碼將圖片的高度設(shè)置為與單元格相同，使其可以填充整個(gè)單元格，并保持垂直居中。 最后，我們來看一下如何將圖片水平和垂直居中。我們可以結(jié)合使用上述兩種方法：

td img {
display: block;
height: 100%;
margin: auto;
}
td {
text-align: center;
vertical-align: middle;
}

這個(gè)CSS代碼將圖片置于單獨(dú)的單元格中，并將其水平和垂直居中。 總的來說，我們可以使用 text-align 和 vertical-align 屬性來實(shí)現(xiàn)圖片的水平和垂直居中。如果需要將圖片放置在單獨(dú)的單元格中，則可以將圖片轉(zhuǎn)換為塊元素，并使用 margin 屬性將其居中。