錄音按鈕是網頁中常用的一種功能，可以實現語音錄制、語音發送等操作。而這個按鈕的樣式是通過CSS來設計的，下面我們來看一下如何使用CSS設計出一個漂亮的錄音按鈕。

.btn {
border: none;
background-color: #33B5E5;
color: white;
padding: 8px 16px;
border-radius: 25px;
box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.2);
font-size: 16px;
cursor: pointer;
}
.btn:hover {
background-color: #0099CC;
}
.btn:active {
background-color: #005E8E;
box-shadow: 0px 1px 5px rgba(0, 0, 0, 0.2);
}
.btn:disabled {
background-color: #C4C4C4;
cursor: not-allowed;
}

上述代碼中，我們先定義了一個類名為btn的樣式，并設置了背景色、字體顏色、邊距、圓角、陰影、字體大小和光標樣式。當鼠標移到按鈕上時，我們使用:hover偽類來改變按鈕的背景色。當按鈕被按下時，使用:active偽類改變按鈕的背景色和陰影。當按鈕被禁用時，使用:disabled偽類改變按鈕的顏色和光標樣式。

這樣就完成了一個簡單的錄音按鈕的設計。當然，實際應用可能還需要根據具體的需求來進行調整和優化。希望這篇文章能夠對大家有所幫助。