CSS自定義LI圖標是一個非常有用的技巧，它可以使列表標記更具吸引力和可讀性。下面，我將向您介紹如何使用CSS自定義LI圖標。

ul {
list-style: none;
padding-left: 0;
}
li {
margin-bottom: 10px;
padding-left: 30px;
position: relative;
}
li:before {
content: "";
position: absolute;
left: 0;
top: 4px;
background-image: url("icon.png");
background-repeat: no-repeat;
background-size: 20px 20px;
width: 20px;
height: 20px;
}

以上代碼解釋了如下幾點：

1. 將無序列表樣式設置為none，去除默認的圓點和數字。

2. 為每個列表項設置左外邊距和前導內邊距。使用position:relative使偽元素與父元素關聯。

3. 使用偽元素li:before在每個列表項前添加圖標。注意：在偽元素中使用content屬性來插入內容（在這種情況下是一個空值），然后設置其它樣式，如background-image、position、width和height。

通過以上步驟，您已成功設置了列表項的自定義圖標。現在，您可以進一步修改這些樣式，以使它們適應您的網站設計。