本文介绍了如何在CSS中为无序列表设置逗号分隔文本样式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧! 问题描述 29岁程序员,3月因学历无情被辞! 我正在寻找一种方法来在XHTML中使用CSS来编排无序列表,以便它被内联呈现,列表项之间用逗号分隔。I’m looking for a way to style an unordered list in XHTML with CSS such that it is rendered inline and the list items are separated by commas.例如,下面的列表应该呈现为 apple,orange,banana (注意列表末尾缺少逗号)。For example, the following list should be rendered as apple, orange, banana (note the missing comma at the end of the list).<ul id="taglist"> <li>apple</li> <li>orange</li> <li>banana</li></ul>目前,我使用下面的CSS来设置这个列表,但会将列表呈现为苹果,橙子,香蕉,(注意在香蕉后面的逗号)。Currently, I’m using the following CSS for styling this list, which almost does what I want, but renders the list as apple, orange, banana, (note the trailing comma after banana).#taglist { display: inline; list-style: none;}#taglist li { display: inline;}#taglist li:after { content: ", ";} $ bIs there a way to solve this problem with pure CSS?推荐答案要删除结尾的逗号,请使用 :last-child 伪类,如下:To remove the trailing comma, use the :last-child pseudo-class, like so:#taglist li:last-child:after { content: "";} 这篇关于如何在CSS中为无序列表设置逗号分隔文本样式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持! 上岸,阿里云!