问答详情
源自:3-2 顶部导航栏(2)

后面的小竖线

后面的小竖线是怎么添加好的呢?不太明白

提问者:weibo_爱吃芒果的洁洁_0 2020-05-16 20:47

个回答

  • qq_慕勒7063652
    2020-05-20 17:26:35

    css伪类元素,相当于用css弄出来一个假元素,固定在每个li的右侧。竖线本质是用它的背景显示出来的,背景黑色宽度1px看起来就是一根竖线

  • qq_慕UI8441337
    2020-05-20 11:33:48

    .nav-box ul li:not(:last-child):after{/*:after伪类*/    content: "";/*每个元素后面加上(这里是背景,如果在“”中间写的是文字,那么每个元素后面都加上这个文字)*/ /*not(:last-child)排除最后一个元素*/    width: 1px;    height: 10px;    background: #cccccc;    position: absolute;/*绝对定位*/    top: 11px;    right: 0;    display: block;}
    z在每个元素后面加上小竖线,然后去除最后一条线。
    小竖线设置为width: 1px;    height: 10px;    background: #cccccc;
    根据前面文字绝对定位。