css怎么給button設(shè)置陰影

css給button設(shè)置陰影的方法：首先創(chuàng)建一個HTML示例文件；然后設(shè)置一個button按鈕；最后通過給button添加“box-shadow”等屬性來實(shí)現(xiàn)陰影效果即可。

本文操作環(huán)境：Windows7系統(tǒng)、HTML5&&CSS3版，DELL G3電腦

css3做一個帶陰影的button按鈕

效果對比鼠標(biāo)劃上前與后：

<!--html代碼--> <input class="but" type = "button" value = "確認(rèn)" />

<!--css代碼--> <style type="text/css">  .but{  border: 0px groove orange;  box-shadow: 5px 6px 10px #000;  margin-left: 160px;  border-radius: 10px;  background: #034c92;  color: white;  width: 250px;  height: 40px;  font-size: 20px;  }  .but:hover{  box-shadow: 8px 10px 10px #000;  background: #005DF9;  }  </style>

【推薦學(xué)習(xí)：css視頻教程】