CSS中的按鈕是網(wǎng)頁設(shè)計中常用的元素之一。常見的按鈕有圓角、矩形和陰影等樣式。但是，有時候我們需要一個特殊的按鈕，如帶有圖標(biāo)的按鈕。在本篇文章中，我將向大家介紹如何使用CSS將按鈕變成一個"×"號圖標(biāo)。

.button {
font-size: 20px;
padding: 10px;
border-radius: 5px;
border: none;
background-color: #007bff;
color: #fff;
cursor: pointer;
position: relative;
}
.button::after {
content: "×";
font-size: 20px;
position: absolute;
top: 6px;
left: 50%;
transform: translateX(-50%);
}
.button:hover {
background-color: #0062cc;
}
.button:hover::after {
color: #fff;
}

以上代碼中，我們使用CSS的偽元素::after來添加了一個“×”號圖標(biāo)。我們首先設(shè)置了.button元素的基本樣式，然后使用::after偽元素添加了一個絕對定位的“×”號文字。我們調(diào)整了圖標(biāo)位置，使其水平中心點(diǎn)與按鈕的文本居中對齊，并將其向上移動一些以更好地定位。

最后，我們添加了:hover偽類，用于在懸停時更改按鈕的樣式。我們將按鈕的背景顏色更改為較深的不同色，并將“×”號圖標(biāo)的顏色更改為白色。

通過使用以上代碼，在任何網(wǎng)頁中實(shí)現(xiàn)一個具有一定美感的“×”號按鈕非常簡單。僅需將以上代碼復(fù)制到自己的css文件中即可使用。