Angular PrimeNG 列表框交叉标签答案

【问题标题】：Angular PrimeNG listbox cross labelAngular PrimeNG 列表框交叉标签
【发布时间】：2019-07-03 16:46:30
【问题描述】：

我正在使用 angular 7.2.0 和 primeng 7.0.0，我正在尝试在列表框中显示元素列表。

如何在列表中越过所选元素的标签而不是突出显示它

【问题讨论】：

【解决方案1】：

我的建议是尝试使用浏览器的 DevTools 检查您尝试修改的元素（在样式部分播放，直到达到所需的结果），然后在您的代码中进行更改。

至于问题，您想删除列表项的选定状态的背景，然后赋予 line-through text-decoration 属性。这应该是使用正确选择器解决您的问题的 CSS 部分：

body .ui-listbox .ui-listbox-list .ui-listbox-item.ui-state-highlight {
    color: #000000;
    text-decoration: line-through;
    background-color: none;
}

请注意，在我们移除蓝色背景后，文本颜色会更改为可见。这仅适用于列表框项的突出显示状态 (.ui-listbox-item.ui-state-highlight)。

如果您不确定如何使用检查工具，请查看谷歌开发者提供的this快速教程。希望这能有所帮助

【讨论】：

对特定访问器的属性进行优先级排序的最快方法是将您的 CSS 放在全局 styles.css 中。你的 angular(cli).json 文件应该把 styles.css 放在一切之上。因此，转到styles.css 并将该css 位放在那里，背景主体为继承/透明或无。这应该工作
如果您想更好地了解和了解有关角度样式的更多信息，请查看this article，其中详细介绍了您的选项。