CSS左邊導航欄長度調整

.left-nav{
width: 200px; /*導航欄默認寬度*/
background-color: #F0F0F0;
float: left;
}
.content{
margin-left: 200px; /*在導航欄寬度為200px的情況下，將內容區向右移200px*/
}

在網頁設計中，經常會用到左邊導航欄的設計，它方便了用戶對網頁內容進行分類和整體把握。但是，對于一些內容比較豐富的網站，我們可能需要一個更加寬敞的導航欄來展示更多的內容，那么我們要如何調整導航欄的寬度呢？

要調整導航欄的寬度，我們需要修改CSS代碼中left-nav這個class的樣式。在上述代碼中，width: 200px;表示導航欄寬度為200像素。通過增加該值，我們就可以增加導航欄的寬度。例如，將其改為width: 300px;即可將導航欄的寬度增加100像素。

需要注意的是，增加導航欄的寬度可能會影響到網頁整體布局，因此我們需要對內容區的位置進行調整。在上述代碼中，.content表示內容區的class樣式，通過增加margin-left樣式來改變內容區在橫向上的位置。具體來說，如果我們將margin-left的值等于導航欄的寬度，即margin-left: 200px;，那么內容區就會像導航欄一樣顯示在左側，并隨著導航欄寬度的增加而向右移動。

總的來說，通過修改left-nav的寬度，我們可以輕松調整導航欄的長度，并通過margin-left來重新設計整個頁面的布局。