Html 使用<；br/>；和可及性

从这个问题/答案来看：在设计可访问的网站时，似乎不应该将

用于演示目的。我这里的意思是，它可以很好地与屏幕阅读器配合使用

我在网页上有一个页脚。页脚只有三个链接。因此，我：

<div id="footer">
  <a href="xxx">xxx</a>,
  Email me: <a href="mailto:yyy">yyy</a>, 
  <a href="zzz">zzz</a>
</div>

,
电邮给我：，

我的问题是:

如何最好地在三行上显示三个链接？

我应该在前两个

之后插入一个

，还是将每一行括在

中
 

重要的是，这是以“可访问的方式”完成的。我需要将代码验证为XHTML 1.0 Strict。

严格的
给我发电子邮件：

关键是屏幕阅读器将直接读取

br

标记，因为它对它没有特别的意义。换行符只是一个视觉指示器，而不是语义指示器。在您链接到的另一个问题中，每一行都应该独立，因此

br

作为分隔符是错误的语义选择

在你的例子中，看起来整个句子在语义上是一个句子（用逗号猜测），但应该只在三行上呈现。在这种情况下，

br

非常适合插入可视换行符，而无需添加任何语义

br

=不暂停阅读，

p

=段落，阅读时适当暂停。

只能用于“实际上是内容一部分”的换行符

此类换行符通常是那些或

在您的情况下，似乎仅出于布局原因才需要换行符。因此在那里使用

br

元素是不正确的

---

您可以使用任何适当的元素并在CSS中添加换行符（

display:block；

），但可以使用类似

p

或

div

的元素，默认情况下，您可以获得这种行为，并且它还可以用于文本浏览器和其他不支持CSS的用户代理。

将导致屏幕阅读器暂停一小段时间。我发现在包含span中使用

role=text

可以解决这个问题

<span role="text">The<br>End</span>

结束

通常，屏幕阅读器会在

标记处将文本拆分，这会使句子听起来很奇怪

如果您想让屏幕阅读器忽略

，使其纯粹呈现，您可以添加

aria hidden

属性，如下所示：

<br aria-hidden="true" />

您的目标是特定的浏览器/浏览器版本吗？嘿@Thomas，您要寻找的是块级元素和内联元素之间的差异。简而言之，现在，为了解决您的问题，您可以简单地将锚定标记包装在块级元素中（例如）？“您特别希望每一行都是独立的，因此您应该将它们放在包装块级别的标记中。您可以将每一行包装在

p

或

div

标记中，然后屏幕阅读器将它们正确地分开。”我想说

方式就是这样做的方式。这样，如果您愿意，您可以为每个人添加不同的css和边距/填充。我认为这里的

在语义上是错误的，但我之前确实读过这方面的文章。。所以我可能错了，像这样的。。我会说放置

。我的锚定标记类{margin bottom:5px；}

，然后将其应用于所有您想要的

a

<代码>好的，我明白了。听起来我可以做这两件事中的任何一件。如果我想暂停一下，那么我可以使用

，如果我只想把事情作为一个句子读出来，我可以使用

。我想我可能会选择

。