为什么在菜单列表中使用UL,LI结构被接受?

23 html css semantic-markup

我是HTML的新手.当我开始阅读列表的文档,我注意到一个无处不在<ul>,<li>结构用,甚至用于创建非常简单的列表.

但对我来说,只<a>使用CSS元素是最舒服的:

display: block;
/* and/or */
float: left;
Run Code Online (Sandbox Code Playgroud)

那么,为什么要使用<ul>,<li>而不仅仅是<a>

非常感谢.

med*_*iev 28

因为在结构上它们是用于该目的的最合适的元素.还可以帮助屏幕阅读器用户正确地指示页面的元素.

请记住HTML是用于标记/内容(这个文本是什么?一个段落?将它包装在ap标签中),CSS用于样式,JS用于行为.

您可以在网页上拥有数千个锚点,但是如果您希望将嵌套在所列项目中的锚点设置为与其他锚点不同,那该怎么办?

<ul>
<li><a href="#">blah</a></li>
</ul>

<a href="#">sfl</a>
Run Code Online (Sandbox Code Playgroud)

如果你已经做好了事情,你的CSS将很容易实现

a { }
ul li a { }
Run Code Online (Sandbox Code Playgroud)

否则你必须在锚点周围抛出类,这将是凌乱和非结构化的.

关于搜索引擎优化 - 我相信在过去语义标记的代码中并没有多少影响,但现在有了像RDF这样的规范,HTML 5元素,网络越来越具有语义性,所以只有像语义一样才有意义.你可以.

2010年,Google指定了三种形式的结构化元数据,他们的系统将使用这些形式在网页中查找结构化语义内容.当与评论,人物档案,商家信息和事件相关时,此类信息将用于增强"摘要"或在网页显示在搜索列表中时显示的短片段文字.Google指定可以使用微数据,微格式或RDFa来提供该数据.[13] 在itemtype中指定微数据,并将itemprop属性添加到现有HTML元素中; 如上所述,微格式关键字被添加到类属性中; 和RDFa依赖于添加到现有元素的rel,typeof和property属性.[14]


Luk*_*keH 13

因为您的标记应该是语义的,而不仅仅是为了显示目的.

阅读文档的任何人或任何事物都可以立即告知标记为标记的部分<ul><li>...</li></ul>是一个列表.

CSS没有描述什么什么,只描述它应该如何呈现.理想情况下,您应该标记文档以描述每个部分是什么,然后使用CSS来适当地渲染这些部分.