橫向導航是網頁設計中經常使用的一種導航形式，但是當導航條中的選項過多時，會導致頁面顯得雜亂無章。為了解決這個問題，我們可以使用橫向導航隱藏菜單。

使用CSS3實現橫向導航隱藏菜單非常簡單。首先，我們需要設置導航條的寬度，以及在超出寬度時導航條的滾動條：

.nav {
width: 100%;
overflow: auto;
}

然后，我們需要將隱藏的菜單放置到導航條之外，并設為不可見：

.hidden-menu {
position: absolute;
top: 50px; /* 50px為導航條高度 */
left: -9999px; /* 放置到導航條左邊之外 */
visibility: hidden; /* 不可見 */
}

接下來，我們給導航條中的菜單設置一個hover事件，當鼠標懸停在菜單上時，隱藏的菜單就會出現：

.nav li:hover .hidden-menu {
left: 0; /* 將隱藏菜單移回導航條內 */
visibility: visible; /* 可見 */
}

最后，我們給隱藏菜單添加一些動畫效果，使得隱藏菜單出現和消失更加平滑：

.hidden-menu {
transition: left 0.3s ease-in-out, visibility 0.3s ease-in-out;
}

綜上所述，我們可以用以上代碼實現橫向導航隱藏菜單的效果，提高網頁的可讀性和用戶體驗。