Strikeout li元素

Question

我想知道如何在<li>元素上制作删除线。它需要具有特定的高度，与之前的线相同。我附上了菜单项目的图片。

我用li：之前做了一个破折号，但我不知道如何弄清楚它的删除线。

Answer 1

这应该有效。我选择通过添加db.collection.updateMany({year: null}, { $unset : { year : 1 }}) CSS类将线路放在特定元素上，但也可以悬停，焦点或其他任何内容。

active

ul {
    list-style: none;
    margin: 0;
    padding: 0;
    max-width: 200px; /* for demo purpose only */
}

li {
    padding-left: 50px;
    position: relative;
    line-height: 30px; /* for demo purpose only */
}

li:before {
    content: '';
    height: 4px;
    background-color: black;
    width: 30px;
    position: absolute;
    left: 0;
    top: 50%;
    /* fix alignment by upping the position of the strikeout by 50% of its height */
    transform: translateY(-50%);
}

li.active:before {
    width: 100%;
}