对于禁用的按钮，您可以使用:disabled伪元素。它适用于所有元素。

仅对于支持CSS2的浏览器/设备，可以使用[disabled]选择器。

与图像一样，不要将图像放在按钮中。将CSS background-image与background-position和一起使用background-repeat。这样，就不会发生图像拖动。

禁用选择器的示例：

button {

  border: 1px solid #0066cc;

  background-color: #0099cc;

  color: #ffffff;

  padding: 5px 10px;

}



button:hover {

  border: 1px solid #0099cc;

  background-color: #00aacc;

  color: #ffffff;

  padding: 5px 10px;

}



button:disabled,

button[disabled]{

  border: 1px solid #999999;

  background-color: #cccccc;

  color: #666666;

}



div {

  padding: 5px 10px;

}


<div>

  <button> This is a working button </button>

</div>



<div>

  <button disabled> This is a disabled button </button>

</div>