CSS中的導航條是網站設計中經常需要用到的樣式。其中最常見的是兩行導航條，它主要由兩條橫線組成，分別用于放置網站的主要導航和次要導航。下面我們來了解一下如何通過CSS來實現一個簡單的兩行導航條。

.nav-container {
/* 設置容器的寬度，以便導航條能夠居中 */
width: 960px;
margin: 0 auto;
}
.nav-bar {
/* 設置兩行導航條的高度 */
height: 60px;
}
.top-bar {
/* 設置頂部導航條的背景顏色和邊框 */
background-color: #333;
border-bottom: 1px solid #000;
}
.bottom-bar {
/* 設置底部導航條的背景顏色 */
background-color: #666;
}
.nav-item {
/* 設置導航項的樣式，如字體、顏色、對齊方式等 */
display: inline-block;
font-size: 16px;
color: #fff;
text-align: center;
line-height: 60px;
margin: 0 20px;
}

以上代碼包含了兩個主要樣式類 .top-bar 和 .bottom-bar，它們分別用于設置頂部和底部導航條的樣式。這兩個樣式類的父元素是 .nav-bar，它包含了所有的導航項，即 .nav-item。 在 .nav-item 樣式中，我們使用了 inline-block 屬性來使導航項橫向排列，并使用 margin 屬性為導航項之間添加空隙。line-height 屬性用于設置導航項的行高，以使其垂直居中。 最后，將以上代碼應用于一個 HTML 頁面中，即可呈現一個簡單的兩行導航條。