CSS置灰按鈕顯示文字

HTML代碼：
<button class="btn-grey">立即購買</button>
CSS代碼：
.btn-grey {
background-color: #f5f5f5;
color: #a0a0a0;
border: none;
border-radius: 5px;
padding: 10px;
cursor: not-allowed;
}
.btn-grey:hover {
color: #777;
}
.btn-grey:active {
background-color: #d8d8d8;
}

如何實現(xiàn)一個置灰按鈕并顯示文字呢？我們可以通過CSS來進行樣式控制，代碼如上。

首先，我們設置按鈕的背景顏色為淺灰色（#f5f5f5），文本顏色為深灰色（#a0a0a0），同時去除邊框樣式，并設置圓角邊框。我們還設置了鼠標樣式為"not-allowed"，表示該按鈕不可用。

其次，我們在:hover偽類中，將文本顏色修改為深灰色（#777），這樣在鼠標移動到按鈕上時，可以提供視覺反饋，提示用戶可以點擊。在:active偽類中，我們將背景顏色修改為深灰色（#d8d8d8），以提供按鈕按下時的視覺效果。

通過以上設置，我們就可以得到一個置灰按鈕并顯示文字的效果啦。需要注意的是，如果按鈕需要在某些條件下變?yōu)榭牲c擊狀態(tài)，只需要通過JS來修改按鈕的CSS樣式即可。