css - angular-dual-listbox-隐藏按钮

我正在使用https://github.com/czeckd/angular-dual-listbox，它的工作原理很像。但是，我需要隐藏“添加/删除”按钮，但我无法。该组件缺少此功能，因此作者建议通过CSS来实现。我试图这样做，但是失败了。这是我的CSS：

button.btn-block {
    display: none !important;
}

我这样做是为了覆盖以下内容（因此'！important'）：

button.btn-block {
    display: block;
    width: 100%;
    margin-bottom: 8px;
}

包含在https://github.com/czeckd/angular-dual-listbox/blob/master/lib/src/dual-list.component.css中。我想念什么吗？

最佳答案

好吧，我终于得到了答案。我问了作者，他帮了我大忙，您可能会在这里看到：https://github.com/czeckd/angular-dual-listbox/issues/36

我花了一段时间才弄清楚他所说的“应用程序的基本样式”的含义。我最终在一个新文件夹“ / src / assets / scss / core / dual-list-box”中创建了一个名为“ hide.scss”的文件，其中包含他提供的行。

hide.scss

div.dual-list div.listbox button[name=addBtn],
div.dual-list div.listbox button[name=removeBtn],
div.dual-list div.listbox div.button-bar {
 display: none;
}

我从位于“ / src / assets”中的file2.scss引用了它，如下所示：

@import "core/dual-list-box/hide";

最后，需要在.angular-cli.json文件的“样式”中包含file2.scss：

"styles": [
    "styles.scss",
    "./assets/scss/file2.scss"
  ],

好吧，差不多了。希望它可以帮助某人。

关于css - angular-dual-listbox-隐藏按钮，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50740251/

Dual

css - angular-dual-listbox-隐藏按钮