为什么我应该在我的HTML中使用UL / LI？ [英] Why should I use UL/LI in my HTML?

问题描述

我有以下结构，对我来说看起来非常好，而且我总是使用HTML5：

 < div class = drop-menudata-dropmenu =language> 
< a href =language / pt-ptclass =drop-menu-link>Português< span>（Brasil）< / span>< / a> 
< a href =language / pt-ptclass =drop-menu-link>Português< span>（Portugal）< / span>< / a> 
< a href =language / esclass =drop-menu-link>Español< / a> 
< a href =language / enclass =drop-menu-link>英语< / a> 
< a href =language / jaclass =drop-menu-link>日本语< / a> 
< a href =language / itclass =drop-menu-link> Italiano< / a> 
< a href =language / declass =drop-menu-link> Deutsch< / a> 
< a href =language / frclass =drop-menu-link>Français< / a> 
< / div> 
  

为什么我应该使用列表结构（ULs / LIs）工作？在这种情况下使用列表真的很有用吗？我总是这样做，它似乎很好。

解决方案

它更符合语义。

你上面的是一个无序的语言列表。您应该使用无序的项目列表（ UL 元素与 LI 元素）在语义上正确。 / p>

这也有助于屏幕阅读器和其他依赖正确语义的技术。

I have the following structure that seems really nice for me and I always use HTML5:

<div class="drop-menu" data-dropmenu="language">
  <a href="language/pt-pt" class="drop-menu-link">Português <span>(Brasil)</span></a>
  <a href="language/pt-pt" class="drop-menu-link">Português <span>(Portugal)</span></a>
  <a href="language/es" class="drop-menu-link">Español</a>
  <a href="language/en" class="drop-menu-link">English</a>
  <a href="language/ja" class="drop-menu-link">日本語</a>
  <a href="language/it" class="drop-menu-link">Italiano</a>
  <a href="language/de" class="drop-menu-link">Deutsch</a>
  <a href="language/fr" class="drop-menu-link">Français</a>
</div>

So why should I use a list structure (ULs/LIs) if just A elements shown as blocks does the job? Is it REALLY useful to use lists in this case? I always do like this and it seems so good.

解决方案

It is more semantically correct.

What you have above is an unordered list of languages. You should be using an unordered list of items (UL element with LI elements) to be semantically correct about it.

This also helps screen readers and other technologies that depend on correct semantics to work.

这篇关于为什么我应该在我的HTML中使用UL / LI？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！