当鼠标悬停在任务上时,为什么删除线会从任务中删除?

时间:2019-01-24 04:24:17

标签: vuejs2 bootstrap-4

我使用Vue JS制作了一个简单的待办事项列表Web应用程序,并使用Bootstrap对其进行了样式设置。当我添加任务并将其标记为完成时,我向其添加了一个类以完成任务。但是,当我将鼠标悬停在任务上时,删除线将被删除。为什么会这样?

这是代码的链接, https://codepen.io/Nik96/pen/GzJxeP

<sample code to ignore>
    Because StackOverflow wouldn't let me post the question otherwise
</sample code to ignore>

1 个答案:

答案 0 :(得分:0)

之所以会这样,是因为在li元素上设置了以下属性(可以是默认值)。

list-group-item:hover {
    z-index: 1;
    text-decoration: none;
}

这将删除您的媒体资源文本装饰:直通

您可以将 text-decoration:line-through!important 用作临时文件,以免覆盖您的媒体资源。

下面更新的codepen链接

https://codepen.io/anon/pen/KJpRqN