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

Question

如何在 button 或 acursor: not-allowed>?我尝试了以下方法:

.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，button 或 a 是可点击的。如果 pointer-events: none 光标不会改变。

请帮助我，我绝望了!

Answer 1

这实际上是一个bug在 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;
}