漢堡菜單是網站常用的一種菜單形式，它可以有效地節約頁面空間，提高用戶體驗。在實現漢堡菜單時，我們可以使用CSS來實現菜單動畫效果。

/* 漢堡菜單按鈕樣式 */
.hamburger {
display: block;
width: 30px;
height: 25px;
position: relative;
cursor: pointer;
}
/* 漢堡菜單條樣式 */
.hamburger span {
display: block;
position: absolute;
height: 4px;
width: 100%;
background: #333;
border-radius: 2px;
opacity: 1;
left: 0;
transform: rotate(0deg);
transition: 0.25s ease-in-out;
}
/* 上下菜單條樣式 */
.hamburger span:nth-child(1),
.hamburger span:nth-child(3) {
top: 0;
}
.hamburger span:nth-child(2) {
top: 50%;
transform: translateY(-50%);
}
.hamburger span:nth-child(4) {
bottom: 0;
}
/* 漢堡菜單打開動畫 */
.hamburger.open span:nth-child(1) {
transform: rotate(45deg);
top: 50%;
}
.hamburger.open span:nth-child(2) {
opacity: 0;
}
.hamburger.open span:nth-child(3) {
transform: rotate(-45deg);
top: 50%;
}
.hamburger.open span:nth-child(4) {
opacity: 0;
}

以上代碼實現了漢堡菜單按鈕的樣式和動畫效果，我們可以通過給按鈕元素添加/移除 "open" 類來實現菜單的打開和關閉。