HTML作為網(wǎng)頁開發(fā)的基礎(chǔ)，涉及到的標簽和用法非常多。其中，常常需要用到的就是li標簽來展示列表。而如果要在列表中展示圖片，并且讓圖片居中顯示，就需要使用一些特定的方法來設(shè)置。下面我們就來看一下具體的實現(xiàn)過程。 首先，我們需要在li標簽中添加img標簽來加載圖片。具體代碼如下：

<ul>
<li><img src="圖片鏈接地址" width="圖片寬度" height="圖片高度"></li>
<li><img src="圖片鏈接地址" width="圖片寬度" height="圖片高度"></li>
<li><img src="圖片鏈接地址" width="圖片寬度" height="圖片高度"></li>
</ul>

在這段代碼中，我們將img標簽放到了li標簽中，其中src屬性是指向圖片的鏈接地址，width和height屬性則是指定圖片的寬度和高度。 接下來，我們需要使用CSS來設(shè)置圖片在li中的居中顯示。具體代碼如下：

<style>
li {
display: flex;          /* 設(shè)置li為flex布局 */
justify-content: center;/* 水平居中 */
align-items: center;    /* 垂直居中 */
}
img {
max-width: 100%;        /* 設(shè)置最大寬度為100% */
max-height: 100%;       /* 設(shè)置最大高度為100% */
}
</style>

在這段代碼中，我們首先將li標簽設(shè)置為flex布局，這樣可以讓它的子元素垂直和水平居中。而img標簽則需要設(shè)置最大寬度和最大高度為100%，以保證它能夠適應(yīng)li的寬高比例。 這樣，我們就可以實現(xiàn)在li標簽中居中顯示圖片的效果了。通過以上的設(shè)置，不僅可以讓圖片顯示更加美觀，還可以提高頁面的用戶體驗。