如何在 Bootstrap 4 中更改禁用 <button> 或 <a> 的光标？

Question

如何使用 cursor: not-allowed on button 或 a ？我尝试了以下方法：

 .not-allowed {
     pointer-events: auto! important;
     cursor: not-allowed! important;
}

我的按钮如下所示：

 <a class="btn btn-primary btn-lg disabled not-allowed" href="https://www.example.com" role="button">Test</a>

如果没有激活指针事件，则无法更改光标。但是如果 pointer-events: auto ， 按钮 或 a 是可点击的。如果 pointer-events: none 光标不会改变。

请帮助我，我绝望了！

原文由 PaT 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这实际上是 Bootstrap 中的一个 错误

建议的解决方案：

 button:disabled {
  cursor: not-allowed;
  pointer-events: all !important;
}

或者如果你有这种结构：

 <li class="disabled">
  <a href="#">My Link</a>
</li>

然后

li.disabled {
  cursor: not-allowed;
}
li.disabled a {
  pointer-events: none;
}

原文由 Mohamed Ramrami 发布，翻译遵循 CC BY-SA 4.0 许可协议