Html 如何仅在两个列表项之间而不是在每个列表项之前显示项目符号?

Html 如何仅在两个列表项之间而不是在每个列表项之前显示项目符号?,html,css,Html,Css,我正在尝试迎合列表中的换行符,以便使用更像分隔符的项目符号,到目前为止,我有这个 ul{ 保证金:自动; 最大宽度:280px; 列表样式:无; 文本对齐:居中; } 李:以前{ 内容:“•”; 颜色:红色; } 李{ 显示:内联; } 项目1 项目2 项目3 项目4 项目5 项目6 项目7 项目8 有几种技术可以帮助您实现这一效果。 首先使用列表元素上的第一个子元素隐藏第一个分隔符 第二种方法有点粗糙,但它是在菜单行结束时隐藏项目符号的方法;使用ul上的伪元素创建覆盖,以隐藏第二行中的第一

我正在尝试迎合列表中的换行符,以便使用更像分隔符的项目符号,到目前为止,我有这个

ul{
保证金:自动;
最大宽度:280px;
列表样式:无;
文本对齐:居中;
}
李:以前{
内容:“•”;
颜色:红色;
}
李{
显示:内联;
}
  • 项目1
  • 项目2
  • 项目3
  • 项目4
  • 项目5
  • 项目6
  • 项目7
  • 项目8

有几种技术可以帮助您实现这一效果。 首先使用列表元素上的第一个子元素隐藏第一个分隔符

第二种方法有点粗糙,但它是在菜单行结束时隐藏项目符号的方法;使用ul上的伪元素创建覆盖,以隐藏第二行中的第一个项目符号

如果要将底行与中间对齐,则需要使用flexbox和justify content:center,并将项目符号移动到每个元素后的右侧。向右移动ul覆盖,隐藏最后一个子项的项目符号,而不是第一个子项的项目符号

ul{页边距:自动;最大宽度:300px;列表样式:无;文本对齐:居中;位置:相对;溢出:隐藏;左填充:0;显示:柔性;柔性环绕:环绕;对齐内容:居中;}
ul:在{内容:;高度:100%;位置:绝对;右侧:0;宽度:0.75rem;背景色:#fff;z-指数:2;}之前
ul>li{显示:内联;填充:0.5雷姆;位置:相对;}
ul>li:before{位置:绝对;右:0;变换:translateX(50%);内容:“•”颜色:红色;}
ul>li:last child:before{display:none;}
  • 项目1
  • 项目2
  • 项目3
  • 项目4
  • 项目5
  • 项目6
  • 项目7
  • 项目8

基本上。。。你不能。要详细说明Paulie的评论,你需要JavaScript来检测每个项目的位置,或者你需要知道每个项目的确切宽度(除了容器的宽度和项目的数量),并使用
nth child
选择器(或者为每个项目添加类,但你说你不想这样做)。这是什么:?@mr.void这不会删除第二行第一项中的项目符号。你不能用CSS做这个。哦,那我误解了,对不起