在导航栏中使用无序列表有什么好处



我看过几篇教程,解释了如何创建导航栏,它们都是先添加一个无序列表,然后删除它的标准样式和列表项(特别是项目符号和边距(。使用列表而不是直接使用a元素或span元素(这些元素没有任何需要删除的样式(有好处吗?

您应该始终根据元素的用途(或语义(标记页面,然后为外观设置样式。

  • 可选容器,例如div,没有语义,可以对任何不相关的元素进行分组-它们不知道内容是什么,它们是如何相关的,以及它们可能起到什么作用列表表示元素之间的固有关系,而不仅仅是项目的随机集合。

  • 从逻辑上(甚至从视觉上(,导航菜单是链接的列表-无论它们是水平显示还是垂直显示,它们仍然是相关项目的列表。列表的默认样式并不总是适用于每种类型的列表,但这并不意味着list元素不适合。

  • 列表允许为子菜单(以及子菜单等(轻松定义层次结构-这是使用列表进行导航的巨大优势。这是因为固有的关系,以及拥有包含其他完整列表的列表项的能力。

  • 它还允许更好的可访问性,因为键盘导航和屏幕阅读器可以更容易地识别这种关系,并在列表中提供更有效的导航。

最新更新