在網站的布局中，左側菜單的設計是非常重要的一部分。一個簡潔、美觀的左側菜單能夠提升用戶的使用體驗，使得網站內容更加易于瀏覽和使用。下面我們介紹一個基于CSS的左菜單布局模板，希望能夠對大家有所幫助。

.left-menu {
position: absolute;
width: 200px;
height: 100%;
background-color: #eee;
box-shadow: 2px 0px 5px rgba(0, 0, 0, 0.3);
}
.menu-item {
display: block;
padding: 10px;
text-decoration: none;
color: #333;
border-bottom: 1px solid #ccc;
}
.menu-item:hover {
background-color: #ddd;
}
.active {
background-color: #ddd;
font-weight: bold;
}

首先，我們需要創建一個固定寬度的側邊菜單.left-menu。通過設置絕對定位（position: absolute），菜單可以遮擋在主體內容的左側，同時也可以很方便地進行樣式設計。

在菜單的樣式設計中，我們為每個菜單項設置了一個.menu-item樣式類。通過這個樣式類，我們可以很方便地改變每個菜單項的樣式。為了更好的用戶體驗，我們在鼠標懸停時為菜單項增加了一個背景顏色（.menu-item:hover）。

對于當前被選中的菜單項，我們需要為其單獨設置一個樣式類.active。這個樣式類將會應用于當前被選中的菜單項，通過改變背景顏色和加粗字體來區分出來。

通過以上的CSS代碼，我們可以快速地為一個網站添加一個美觀、簡潔的左側菜單布局。希望大家可以借鑒這個模板，在自己的網站設計中得到啟發。