在現代社會，手機已經成為人們日常生活中必不可少的一部分，而手機的使用離不開各種不同的按鈕，比如頂部導航欄、底部工具欄、輸入框等。如何對這些按鈕進行美化？CSS樣式就派上了用場。

.button {
display: inline-block；
padding: 10px 20px；
background-color: #42a5f5；
color: #fff；
font-size: 16px；
border-radius: 5px；
box-shadow: 0 2px 5px rgba(0,0,0,0.2)；
}
.button:hover {
background-color: #64b5f6；
box-shadow: 0 3px 7px rgba(0,0,0,0.3)；
}
.button:active {
background-color: #2196f3；
box-shadow: none；
transform: translateY(2px)；
}

上面的代碼對一個普通按鈕進行了樣式設置。其中，display: inline-block；使按鈕可以像文字一樣進行排列，padding: 10px 20px；使按鈕內容與邊框之間有一定的間距，background-color: #42a5f5；color: #fff；設置了按鈕的背景顏色以及字體顏色，font-size: 16px；調整了字體大小，border-radius: 5px；讓按鈕的圓角看起來更加圓潤。

在按鈕被鼠標懸停（:hover）時，背景色會變為淡藍色，并有一定的陰影效果。而當按鈕被按下（:active）時，背景色會變成更深的藍色，并移動2px的距離，給用戶一個反饋。

這只是對一個普通按鈕樣式的簡單設置，實際上，想要實現更加復雜的效果，比如漸變色、邊框動畫等，都可以通過CSS樣式來實現。完美的按鈕樣式可以提升用戶對產品的體驗感，值得我們花費更多的精力去設計。