CSS实现导航隐藏功能，可以通过设置导航元素的display属性为none实现隐藏效果。CSS代码如下：

nav {display: none;}

但是这种方式仅仅是隐藏了导航，而并未移除DOM中的该元素，可能会影响页面其他元素的布局和效果。如果需要完全移除导航元素，可以通过设置其visibility属性为hidden来实现。

nav {visibility: hidden;}

另外，也可以通过JavaScript来实现导航的隐藏和显示效果。比如以下代码实现了点击按钮时显示或隐藏导航：

var nav = document.querySelector('nav');var button = document.querySelector('button');button.addEventListener('click', function() {if(nav.style.display === 'none') {nav.style.display = 'block';} else {nav.style.display = 'none';}});

通过以上方法，就可以轻松实现导航的隐藏效果，从而达到更好的用户体验效果。