• 首页 首页 icon
  • 工具库 工具库 icon
    • IP查询 IP查询 icon
  • 内容库 内容库 icon
    • 快讯库 快讯库 icon
    • 精品库 精品库 icon
    • 问答库 问答库 icon
  • 更多 更多 icon
    • 服务条款 服务条款 icon

CSS :not(:last-child):after 选择器

用户头像
it1352
帮助1

问题说明

我有一个元素列表,其样式如下:

I have a list of elements, which are styled like this:

ul {
    list-style-type: none;
    text-align: center;
}

li {
    display: inline;
}

li:not(:last-child):after {
    content:' |';
}
<ul>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
    <li>Five</li>
</ul>

输出 一个 |二 |三 |四 |五个 | 而不是 一个 |二 |三 |四 |五

有人知道如何通过 CSS 选择除最后一个元素之外的所有元素吗?

Anyone know how to CSS select all but the last element?

可以看到:not()选择器的定义这里

正确答案

#1

如果是not选择器有问题,可以全部设置,覆盖最后一个

If it's a problem with the not selector, you can set all of them and override the last one

li:after
{
  content: ' |';
}
li:last-child:after
{
  content: '';
}

或者如果你可以使用之前,不需要last-child

or if you can use before, no need for last-child

li li:before
{
  content: '| ';
}

这篇好文章是转载于:学新通技术网

  • 版权申明: 本站部分内容来自互联网,仅供学习及演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,请提供相关证据及您的身份证明,我们将在收到邮件后48小时内删除。
  • 本站站名: 学新通技术网
  • 本文地址: /reply/detail/tangibhfh
系列文章
更多 icon
同类精品
更多 icon
继续加载