Question

我可以让输入元素回复:hover和:hover:disable

但看起来像div没有回应相同。

.btn {
  width: 99px;
  border-color: 2px #787878;
  background-color: #CACACA;
  margin-left: 76px;
  margin-top: 21px;
  position: relative;
  border-radius: 26px;
  -moz-border-radius: 26px;
  -webkit-border-radius: 26px;
  cursor: pointer;
}
.btn:hover:disabled {
  background: red;
  cursor: no-drop;
}

<div class="btn" id="divDisable" style=" height: 30px;line-height: 30px; text-align: center;" disabled>Disabled
</div>

<input class="btn" id="iDisabled" type="submit" value="Disabled" disabled>

Full Sample我尝试的一切

奖励信息

问题是答案div没有禁用

Make div content Disable

http://jsfiddle.net/WS47f/

Answer 1

div元素没有禁用属性。在这种情况下，您可以为CSS添加一个类。

div.divDisable:hover {}

Answer 2

派对可能会迟到，但解决方法是使用.btn[disabled]:hover代替.btn:disabled:hover。第一个没有检测到禁用状态（div上不存在），而是存在disabled属性的存在。

.btn {
  width: 99px;
  border-color: 2px #787878;
  background-color: #CACACA;
  margin-left: 76px;
  margin-top: 21px;
  position: relative;
  border-radius: 26px;
  -moz-border-radius: 26px;
  -webkit-border-radius: 26px;
  cursor: pointer;
}
.btn[disabled]:hover {
  background: red;
  cursor: no-drop;
}

<div class="btn" id="divDisable" style=" height: 30px;line-height: 30px; text-align: center;" disabled>Disabled
</div>

<input class="btn" id="iDisabled" type="submit" value="Disabled" disabled>

Answer 3

要让两者做同样的事情：

    .btn:hover {
  background: red;
  cursor: no-drop;
}

这是一个演示：https://jsfiddle.net/cs8rbjkh/

的小提琴

如何设置禁用DIV元素的样式

3 个答案: