CSS中，我們經(jīng)常需要用到列表，而在列表中加入圖片是必不可少的一個(gè)操作。今天，我們就來學(xué)習(xí)一下如何使用CSS來實(shí)現(xiàn)在ul li列表中加入圖片。

首先，我們需要準(zhǔn)備一張圖片，并把圖片的路徑記錄下來。

<img src="images/avatar.jpg" alt="avatar">

接下來，我們需要將圖片作為背景，這就需要使用background-image屬性。

li {
list-style-type: none;
background-image: url("images/avatar.jpg");
background-repeat: no-repeat;
background-position: left center;
padding-left: 50px;
}

在此代碼中，我們將li元素的默認(rèn)列表樣式去除，將圖片作為背景，設(shè)置圖片不重復(fù)，圖片在左側(cè)居中顯示，同時(shí)，為了避免文字和圖片重合，我們還需要向左側(cè)縮進(jìn)50px。

最終，我們就可以得到一個(gè)包含圖片的ul li列表了。

<ul>
<li>第一項(xiàng)</li>
<li>第二項(xiàng)</li>
<li>第三項(xiàng)</li>
</ul>

以上就是在CSS中使用ul li列表加入圖片的方式，希望對(duì)大家有所幫助。