div li居中顯示是指在HTML中，將包含li元素的div元素垂直居中顯示。通常情況下，li元素默認以塊級元素的方式顯示，而div元素則默認以塊級容器的方式顯示。因此，想要在div元素中垂直居中顯示li元素需要進行一些特殊的CSS樣式設置。
下面將通過幾個代碼案例詳細解釋說明div li居中顯示的方法。
案例一： 在這個案例中，我們將使用flex布局來實現div li居中顯示。以下是一個可以實現此效果的CSS代碼：

div {
display: flex;
justify-content: center;
align-items: center;
}

在上述代碼中，我們使用display: flex屬性將div元素設置為flex容器。然后，通過justify-content: center和align-items: center屬性將li元素在水平和垂直方向上居中顯示。
案例二： 在這個案例中，我們將使用position屬性來實現div li居中顯示。以下是一個可以實現此效果的CSS代碼：

div {
position: relative;
}
<br>
ul {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

在上述代碼中，我們將div元素設置為相對定位（position: relative），然后將ul元素設置為絕對定位（position: absolute）。通過top: 50%，left: 50%屬性將ul元素的位置定位在div元素的中心。接著，通過transform: translate(-50%, -50%)屬性將ul元素向左上方移動其自身寬度和高度的一半，從而實現居中顯示。
案例三： 在這個案例中，我們將使用flexbox和另一種方法來實現div li居中顯示。以下是一個可以實現此效果的CSS代碼：

div {
display: flex;
justify-content: center;
}
<br>
ul {
display: inline-flex;
}

在上述代碼中，我們將div元素設置為flex容器，并通過justify-content: center屬性將ul元素在水平方向上居中顯示。接著，我們將ul元素的display屬性設置為inline-flex，使其以行內塊元素的方式顯示，從而使li元素在同一行內并在水平方向上居中顯示。
通過以上幾個案例，我們可以看到div li居中顯示可以使用不同的CSS樣式來實現。只需根據實際需要，選擇其中一種或多種方法進行設置即可。在編寫網頁時，根據具體的布局和設計要求選擇合適的方法，將使整體頁面效果更加美觀。