CSS的好看的列表樣式是我們網頁設計中不可或缺的一部分。下面,讓我們來介紹一些不錯的樣式,讓你的列表變得更加美觀吧!
/*實心圓樣式*/ ul { list-style-type: none; margin: 0; padding: 0; } li:before { content: "●"; color: #ff9800; font-size: 20px; margin-right: 10px; } /*空心圓樣式*/ ul { list-style-type: none; margin: 0; padding: 0; } li:before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color: #ff9800; margin-right: 10px; } /*數字樣式*/ ol { list-style-type: decimal; margin: 0; padding: 0; } li { font-size: 16px; line-height: 20px; margin-bottom: 10px; } /*圖標樣式*/ ul { list-style-type: none; margin: 0; padding: 0; } li:before { content: ""; display: inline-block; width: 20px; height: 20px; background-image: url("icon.png"); margin-right: 10px; }
以上就是一些比較流行的CSS列表樣式,你可以根據自己的需求選擇適合自己的樣式。同時也可以根據自己的設計風格和品牌元素進行自定義。讓我們的網頁更具特色,更加吸引人!
上一篇php opencv系統
下一篇ajax實現搜索自動補全