1.简单智能的导航菜单形式

    这款菜单可以适用于所有屏幕的一些设计，菜单扁平化，留有足够空间在各个不同的屏幕上做响应式的变化，一种简单的设计便可以轻松调整。

    先来看下面这款非常简单色块的导航，采用了由网页文字链变到移动设备的按钮形式，规避了移动设备操作不精准等一些弊端。

    另一种常见的右侧导航设计在很多网站中都有应用，在移动设备上，导航横向排列不变，Logo和导航由一行变为两行，页面简洁清晰且用户体验一致。


    2.导航菜单列表形式

    最常用的一种排列形式，横向导航在小屏幕下变为纵向排列，一列、两列甚至是多列多行的形式，具体应实际情况而定。

    3.导航隐藏形式

    在手机设备上导航的另一种形式以隐藏列表的方式呈现，是对空间的有效利用，突出高优先级内容的处理方式。

    来看下Microsoft的下拉隐藏菜单，通过设定图标点击对菜单做收缩或展开。经典、简约的布局完美适合平台转换。

    4.下拉菜单形式

    使用下拉菜单来组织复杂内容是一个非常方便和流行的方式,复杂的网站甚至会使用多层次的下拉菜单。在较小的屏幕上，在依赖触摸反应的设备上，下拉菜单要慎用。这里没有悬浮效果，屏幕资源可能非常有限。默认情况下，导航菜单根本就不显示，只有当触摸到右上角指定的小图标时，第一个内容层才会打开。当触摸到其中一个栏目时，第二个内容层才会逐渐展开，给用户一个非常清晰明了的内容导航。

    好了，以上就是优漫小编给大家介绍的响应式页面导航四大设计，希望对大家有所帮助。