CSS雙行顯示菜單可以讓我們在頁面上展示更多的內容，提高頁面的信息密度。下面我們來看一下實現這個效果的方法。

.nav {
display: flex;
flex-wrap: wrap;
}
.nav >li {
flex: 1;
}
@media screen and (max-width: 768px) {
.nav >li {
flex-basis: 50%;
}
}

首先，我們需要將導航菜單所在的容器設置為 flex 布局，并設置其 flex-wrap 屬性為 wrap，這樣子元素就可以自動換行了。

接下來，我們需要給每一個導航菜單項設置 flex 屬性為 1，這樣菜單項就可以均分容器的寬度，實現雙行顯示。

最后，我們利用 @media 查詢，給小屏幕設備設置 .nav >li 的 flex-basis 屬性為 50%。這樣在小屏幕設備上，每一行只會顯示兩個菜單項。

通過以上代碼的設置，我們就可以實現 CSS 雙行顯示菜單的效果了。如果你也想在你的網站上使用這個效果，只需要將以上代碼復制到你的 CSS 文件中即可。