色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css在li中加圖片

錢多多1年前10瀏覽0評論

在網頁設計中,圖片的運用是非常重要的,尤其是列表元素中的圖片。在CSS中,我們可以很容易地為列表中的每一個元素添加圖片。

ul li {
list-style: none;
padding-left: 20px;
background: url("li_icon.png") no-repeat left center;
}

在上面的代碼中,我們使用了background屬性來添加我們的圖片。其中,list-style屬性被設置為none,這意味著我們將不再使用瀏覽器默認的列表標記。

padding-left屬性的設置是為了在圖片左邊留出一定的空間,使得文字能夠與圖片分開。我們將背景圖像設置為no-repeat,這樣背景圖像就不會被重復出現。而left center則是為了指定圖像在列表項中的位置。

如果我們需要在列表項中加入一個不同的圖像,只需要為每一個列表項設置不同的類名,并在CSS中設置不同的背景圖像路徑,如下所示:

ul li.list-1 {
background: url("list-1.png") no-repeat left center;
}
ul li.list-2 {
background: url("list-2.png") no-repeat left center;
}

通過上面的代碼,我們為每個列表項都設置不同的類名,并為每個類名設置不同的背景圖像,從而讓每個列表項都具有獨特的外觀。

總的來說,通過在CSS中為列表項添加背景圖像,我們可以改變列表項的外觀,讓列表更加美觀和有吸引力。