<div button樣式是指使用CSS樣式來改變<div>和<button>標簽的外觀和交互的效果。通過添加不同的樣式屬性，可以實現不同的按鈕效果，從而增強用戶體驗。
在下面的幾個代碼案例中，我們將使用CSS來改變<div>和<button>標簽的樣式，從簡單的邊框和背景顏色 修改到更復雜的漸變和動畫效果，讓按鈕看起來更加吸引人。
第一個案例展示了如何給按鈕添加一個邊框和背景顏色。通過在CSS樣式表中設置border屬性和background-color屬性，我們可以改變按鈕的外觀。

<style>
.btn {
border: 2px solid #FF0000;
background-color: #008000;
color: #FFFFFF;
padding: 10px 20px;
font-size: 16px;
}
<br>
.btn:hover {
background-color: #00FFFF;
}
</style>

在上面的代碼中，我們為按鈕添加了一個紅色的邊框，并將背景顏色設置為綠色。同時，我們還設置了按鈕的文本顏色和內邊距以及字體大小。當鼠標懸停在按鈕上時，我們將背景顏色改變為青色，這為用戶提供了視覺反饋。

第二個案例展示了如何使用漸變效果來改變按鈕的背景顏色。通過使用linear-gradient()函數，我們可以創建水平或垂直方向的漸變效果。

<style>
.btn {
border: 2px solid #FF0000;
background-image: linear-gradient(to right, #FF0000, #0000FF);
color: #FFFFFF;
padding: 10px 20px;
font-size: 16px;
}
<br>
.btn:hover {
background-image: linear-gradient(to right, #0000FF, #FF0000);
}
</style>

在上面的代碼中，我們為按鈕添加了一個紅到藍的水平漸變，即從左到右顏色從紅色漸變到藍色。當鼠標懸停在按鈕上時，我們將漸變反向，即從右到左顏色從藍色漸變到紅色，從而達到動態的效果。

第三個案例展示了如何給按鈕添加一個動態的陰影效果。通過使用box-shadow屬性，我們可以創建一個具有柔和陰影效果的按鈕。

<style>
.btn {
border: 2px solid #FF0000;
background-color: #008000;
color: #FFFFFF;
padding: 10px 20px;
font-size: 16px;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}
<br>
.btn:hover {
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
}
</style>

在上面的代碼中，我們為按鈕添加了一個黑色的陰影。陰影通過設置box-shadow屬性的參數來實現，第一個參數為水平偏移，第二個參數為垂直偏移，第三個參數為模糊半徑，第四個參數為陰影的顏色和透明度。當鼠標懸停在按鈕上時，我們將陰影的模糊半徑增加到20像素，增強了陰影效果。

通過上面的幾個代碼案例，我們可以看到如何使用CSS樣式來改變<div>和<button>標簽的外觀和交互的效果。通過靈活運用不同的樣式屬性，我們可以創建出獨特的按鈕樣式，讓用戶更加吸引和舒適的使用網站。無論是簡單的邊框和背景顏色，還是復雜的漸變和動畫效果，都能通過<div button樣式輕松實現。