小程序導航是小程序常用的組件之一，它能夠提供便捷的導航功能，方便用戶快速切換頁面。在實現小程序導航時，CSS樣式的編寫是不可或缺的一部分。

/** 導航欄容器 **/
.nav-container {
width: 100%;
height: 50px;
background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, .2);
display: flex;
align-items: center;
justify-content: space-between;
}
/** 導航欄單個按鈕 **/
.nav-item {
height: 100%;
line-height: 50px;
padding: 0 20px;
color: #333;
text-decoration: none;
font-size: 16px;
font-weight: bold;
}
/** 導航欄按鈕激活狀態 **/
.nav-item.active {
color: #00CED1;
border-bottom: 2px solid #00CED1;
}

在上述代碼中，我們定義了導航欄容器的樣式，設置其寬度、高度、背景顏色、陰影效果、以及flex布局。對于導航欄按鈕，我們設置其高度、行高、內邊距、字體顏色、字體大小和粗細，并為激活狀態的按鈕設置字體顏色和底部邊框。

通過CSS的樣式設計，我們可以輕松地美化小程序導航，使其更加符合我們的設計需求，增強用戶體驗。如果您是小程序開發者，建議掌握CSS樣式編寫技巧，以便更好地開發小程序導航組件。