移除列表标记而不影响语义

:where(ul, li, menu) {
  list-style: "";
}

更“正确”的方法是将 list-style 设置为 none，但这样做会带来一个潜在的后果，即 Safari 不会再从语义上识别该元素为一个正确的列表。我们可以通过 HTML 来解决这个问题

<ol style="list-style: none;" role="list">
  <li role="listItem">...</li>
  <li role="listItem">...</li>
  <li role="listItem">...</li>
</ol>

<ul style="list-style: none;" role="list">
  <li role="listItem">...</li>
  <li role="listItem">...</li>
  <li role="listItem">...</li>
</ul>

…但是 CSS 代码片段可以避免我们在两个地方维护内容。代码片段之所以有效是因为空字符串的计算结果恰好是：空字符串。

与任何类似情况一样，值得使用屏幕阅读器和真实用户进行彻底测试，以确保你的作品的语义和可访问性不受负面影响。