导航栏图标风格（帮你全方位掌握导航栏设计知识点）
导航栏图标风格（帮你全方位掌握导航栏设计知识点）分隔线并不仅仅是一条线，它可以是线、面或投影，用于分隔导航栏与内容区域的一个边界线，通过视觉阻断的方式让用户感知内容区域，避免在页面产生上下滑动交互后重复扫视顶部位置。分割线是为了体现导航栏与内容界面的层级关系，缺少视觉分割可能会让用户感觉它们是一个平级，会增加感知难度。当然，并不是所有的应用或界面都需要视觉分割，例如：界面内容极少、界面背景色与导航栏容器背景色值有明显差异、多图/多卡片……最常见的样式，95%以上的2级及后续界面使用的都是常规导航栏，部分较为简单的主页也会使用这种类型。以iOS的2倍图为例，容器高度固定在88px，基本只有按钮、标题组成，背景色多为白色或主体色。
6. 用户头像
很多社交类产品，会在导航栏的左、右侧放置用户的头像信息，方便随时调用与用户相关的功能。例如点击后进入个人设置、个人信息展示、会员中心、个人主页等。
7. 标签/分类
导航栏的分类菜单包括分段控件和标签导航，分段控件通常包含2~4个标签，直接点击进行内容切换，不支持左右滑动；标签导航则相对灵活，很适合分类较多的内容，可通过左右滑动来查看所有分类，实现更方便的导航。
8. 更多菜单
上述提到的标签是对产品内容的分类，而这里更多指的是产品、系统的辅助功能。
当页面的某些功能操作频率较高或与当前页面信息相关联但不方便直接展示入口、也可能因导航栏剩余空间不足以承载时，将功能放置在更多菜单中，既能适当的给用户提供操作入口，也能满足产品多方面的隐性需求。
9. 分割线
分隔线并不仅仅是一条线，它可以是线、面或投影，用于分隔导航栏与内容区域的一个边界线，通过视觉阻断的方式让用户感知内容区域，避免在页面产生上下滑动交互后重复扫视顶部位置。
分割线是为了体现导航栏与内容界面的层级关系，缺少视觉分割可能会让用户感觉它们是一个平级，会增加感知难度。当然，并不是所有的应用或界面都需要视觉分割，例如：界面内容极少、界面背景色与导航栏容器背景色值有明显差异、多图/多卡片……
1. 常规样式
最常见的样式，95%以上的2级及后续界面使用的都是常规导航栏，部分较为简单的主页也会使用这种类型。以iOS的2倍图为例，容器高度固定在88px，基本只有按钮、标题组成，背景色多为白色或主体色。
