用于字母列表的语义 HTML

Question

我需要编写一个简单的按字母顺序排列的单词列表，如下所示：

一个
- 安道尔
- 安哥拉
- 安提瓜和巴布达
- 阿根廷

B
- 巴哈马
- 巴林
- 孟加拉国
- 巴巴多斯

（等等）

是否可以使用有序列表来保持我的 HTML 语义，然后使用 CSS 清除样式？

Answer 1

CSS 不影响语义。您可以以任何您想要的方式设置ol 的样式（在没有任何列表指示符的情况下显示它、使用项目符号而不是数字、在一行中显示它、在视觉上隐藏它等等），它一直是ol，并且它保持其语义。

除非页面明确说明条目按字母顺序排序，否则使用ul 而不是ol 可能是合适的。 ol 只有在不同的顺序会改变含义时才能使用。

因此，如果字母顺序的唯一指示符是标题（“A”、“B”等），您可以使用ul：

<section>
  <h2>List of …</h2>

  <section id="a">
    <h3>A</h3>
    <ul>
      <li>Andorra</li>
      <li>Angola</li>
    </ul>
  </section>    

  <section id="b">
    <h3>B</h3>
    <ul>
      <li>Bahamas</li>
      <li>Bahrain</li>
    </ul>
  </section>    

</section>

但是，有人可能会争辩说，像“A”这样的标题意味着条目是按字母顺序排序的（而不是仅仅以“A”开头）。在这种情况下，应该使用ol。