CSS Button可以用于網站頁面的設計和布局，具有豐富的功能和樣式。其中，內凹的效果是一種常見的按鈕樣式之一，可以給網站頁面帶來簡潔而美觀的外觀。下面我們就來學習一下如何制作CSS Button內凹的效果吧。

內凹按鈕

首先，在HTML中創建一個按鈕，并為其添加一個類名“button-concave”。

.button-concave{
background-color: #ccc;
border: none;
border-bottom: 4px solid #aaa;
box-shadow: inset 0 -3px 0 #aaa;
font-size: 20px;
padding: 10px 30px;
}

然后，在CSS中為按鈕添加樣式，實現內凹的效果。具體樣式如下：

• 背景顏色：給按鈕設定背景顏色，這里我們選用灰色的色值“#ccc”；
• 邊框：給按鈕去掉邊框和圓角，只保留下邊框，并設定邊框粗細為4px，顏色為深灰色“#aaa”；
• 內凹陰影：通過box-shadow屬性，添加一個內凹的陰影效果，讓按鈕看起來向內凹陷；
• 字體大小：設置按鈕中文字的大小，這里我們選用20px；
• 內邊距：為了讓按鈕文字與四周有一定的間隔，需要設置內邊距，這里設定10px 30px。

通過以上樣式設置，我們就成功實現了CSS Button內凹的效果。你可以在自己的網站頁面中嘗試使用這種簡潔而美觀的按鈕樣式，為用戶帶來更好的瀏覽體驗。