CSS中設(shè)置按鈕的陰影效果圖可以通過使用box-shadow
屬性來實(shí)現(xiàn)。box-shadow
屬性可以為按鈕添加多個(gè)陰影效果,包括陰影的大小、形狀、顏色等。
下面是一個(gè)示例代碼,展示如何為按鈕添加陰影效果圖:
.button { width: 100px; height: 50px; background-color: #333; color: #fff; border: none; border-radius: 5px; padding: 10px; text-align: center; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); }
在這個(gè)示例中,我們?yōu)榘粹o添加了一個(gè)陰影效果圖,陰影的大小為5px,形狀為橢圓形,顏色為rgba(0, 0, 0, 0.5)(半透明的黑色),你可以根據(jù)自己的需求調(diào)整陰影的大小、形狀和顏色。
注意,box-shadow
屬性的值可以設(shè)置為多個(gè),以添加多個(gè)陰影效果,你也可以使用其他CSS屬性來進(jìn)一步美化按鈕,如border-radius
(圓角)、padding
(內(nèi)邊距)等。