在網頁制作過程中，一個好的導航對用戶體驗的提升有非常顯著的作用。而使用CSS進行導航制作則可以讓導航的樣式更加美觀，也更加靈活。下面將介紹一些常用的CSS導航制作方法。

1. 橫向導航
.nav{ 
list-style: none; 
margin-left: 0; 
padding-left: 0; 
} 
.nav>li{ 
display: inline-block; 
position: relative; 
margin-right: 10px; 
} 
.nav>li>a{ 
display: block; 
padding-right: 20px; 
padding-left: 20px; 
} 
.nav>li>a:hover{ 
background-color: #eee; 
} 
2. 縱向導航
.nav{ 
list-style: none; 
margin-left: 0; 
padding-left: 0; 
} 
.nav>li{ 
position: relative; 
margin-bottom: 10px; 
} 
.nav>li>a{ 
display: block; 
padding: 10px 15px; 
} 
.nav>li>a:hover{ 
background-color: #eee; 
} 
3. 下拉菜單導航
.nav{ 
list-style: none; 
margin-left: 0; 
padding-left: 0; 
} 
.nav>li{ 
position: relative; 
display: inline-block; 
margin-right: 10px; 
} 
.nav>li>a{ 
display: block; 
padding: 10px 15px; 
} 
.nav>li>ul{ 
position: absolute; 
top: 100%; 
left: 0; 
display: none; 
list-style: none; 
margin: 0; 
padding: 0; 
} 
.nav>li:hover>ul{ 
display: block; 
} 
.nav>li>ul>li{ 
display: block; 
margin: 0; 
} 
.nav>li>ul>li>a{ 
display: block; 
padding: 10px 15px; 
} 
.nav>li>ul>li>a:hover{ 
background-color: #eee; 
}

以上代碼為常見的三種導航制作方式，通過不同的樣式效果可以滿足不同的設計需求。但是需要注意的是，在實際使用過程中，還需要根據具體情況進行代碼調整和優化，以達到更好的用戶體驗和頁面效果。