CSS是網頁設計中不可或缺的一部分。通過巧妙的設計，可以使按鈕更美觀，更有吸引力。紅色按鈕是一個常見的設計，下面就來看一下如何用CSS編寫一個紅色按鈕的代碼。

.button {
display: inline-block;
padding: 10px 20px;
font-size: 16px;
color: #fff;
background-color: #f00;
border-radius: 5px;
text-decoration: none;
}
.button:hover {
background-color: #d00;
}

上述代碼中，我們首先定義了一個名為“button”的類。這個類將應用于我們想要設計的按鈕元素中。我們使用“display: inline-block”將按鈕轉換為塊級元素，并使用“padding”屬性為按鈕添加內邊距。

下一步，我們設置了按鈕字體大小和顏色。并將按鈕的背景顏色設置為紅色（#f00）。

接下來，我們使用“border-radius”屬性為按鈕添加圓角，并使用“text-decoration:none”刪除了默認的下劃線樣式。

當鼠標懸停在按鈕上時，我們將使用:hover偽類更改按鈕的背景顏色，使其更暗。

通過上述代碼，我們已經成功地創建了一個簡單但漂亮的紅色按鈕！