CSS導航二級菜單橫排是現代網頁設計中經常使用的一種布局方式，它可以更加清晰和有效地呈現網站的導航和內容結構，讓用戶更容易地找到他們需要的信息。下面我們來一起學習一下如何使用CSS實現導航二級菜單的橫排布局。

/* 定義導航列表樣式 */
ul.nav {
list-style: none;
margin: 0;
padding: 0;
background-color: #36c;
text-align: center;
}
/* 定義導航列表項樣式 */
ul.nav li {
display: inline-block;
position: relative;
}
/* 定義二級菜單樣式 */
ul.nav li ul {
display: none;
position: absolute;
left: 0;
top: 100%;
}
/* 定義鼠標經過時二級菜單顯示樣式 */
ul.nav li:hover ul {
display: block;
}
/* 定義二級菜單列表項樣式 */
ul.nav li ul li {
display: block;
}
/* 定義二級菜單列表項鏈接樣式 */
ul.nav li ul li a {
display: block;
padding: 10px;
background-color: #fff;
color: #36c;
text-decoration: none;
}
/* 定義當前頁鏈接樣式 */
ul.nav li.current a {
background-color: #fff;
color: #36c;
}
/* 定義鼠標經過鏈接樣式 */
ul.nav li:hover a {
background-color: #fff;
color: #36c;
}

上述代碼中，我們首先定義了一個具有背景顏色、文本居中樣式的導航列表。每個導航列表項都是一個inline-block元素，具有相對定位，因此在每個列表項上可以添加一個絕對定位的二級菜單。我們也定義了一個二級菜單列表項樣式以及鏈接樣式，這些樣式將在鼠標經過時顯示。

最后，我們給當前頁的鏈接添加了上下文樣式以及鼠標經過時的背景和文字顏色樣式，這樣用戶就可以更好地區分他們所在的頁面和他們需要單擊的鏈接。