如果您想讓自己的網站外觀更加美觀和專業，那么漂亮的側導航欄是一個不錯的選擇。在這篇文章中，我們將介紹如何使用CSS創建一個漂亮的側導航欄。

/* 創建側導航欄的CSS樣式 */
.sidenav {
height: 100%;
width: 200px;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #f6f6f6;
overflow-x: hidden;
padding-top: 20px;
}
/* 側導航欄的鏈接樣式 */
.sidenav a {
padding: 6px 8px 6px 16px;
text-decoration: none;
font-size: 20px;
font-weight: bold;
color: #000;
display: block;
transition: 0.3s;
}
/* 鼠標懸停時鏈接的樣式 */
.sidenav a:hover {
color: #f6f6f6;
background-color: #000;
}

使用上面的CSS代碼，我們可以創建一個具有以下特點的漂亮的側導航欄：

• 寬度為200像素，固定在屏幕左側
• 使用#f6f6f6作為背景顏色
• 鏈接具有粗體字體、20像素的字號和黑色文本顏色
• 在鼠標懸停時，文字顏色變成白色，背景顏色變成黑色

如果你希望你的網站外觀更加美觀，從現在開始使用這樣的漂亮的側導航欄吧！