我已经审阅过 https://stackoverflow.com/questions/5542428/why-on-earth-is-address-a-block-level-element,发现它对此事几乎没有什么帮助。
一位客户给了我一段纯文本,我正在尝试针对用户体验和 SEO 对其进行优化。这是文本中间的相关片段:
<p>[Several sentences]. Having trouble? Contact <address style="font-style:normal;display:inline">Jane Doe at <a href="mailto:jdoe@example.com">jdoe@example.com</a> or <a href="callto:5551234567">(555) 123-4567</a></address> between the hours of 9AM and 5PM. [Several sentences].</p>
但是,由于 <address>
是 block 级元素,DOM 最终看起来像这样:
<p>[Several sentences]. Having trouble? Contact </p>
<address style="font-style:normal;display:inline">Jane Doe at <a href="mailto:jdoe@example.com">jdoe@example.com</a> or <a href="callto:5551234567">(555) 123-4567</a></address>
between the hours of 9AM and 5PM. [Several sentences].<p></p>
输出如下:
[Several sentences]. Having trouble? Contact
Jane Doe at jdoe@example.com or (555) 123-4567between the hours of 9AM and 5PM. [Several sentences].
显然,这破坏了用户体验,并且不是有效的 HTML。我的问题是 <address>
仅是 block 级的原因是什么,有什么方法可以让它内联显示?正如您所见,CSS display:inline
属性/值对帮助情况
最佳答案
Why can't address elements be in
p
elements?
Because the HTML specification defines them that way .
The
address
element represents the contact information for its nearestarticle
orbody
element ancestor. If that is thebody
element, then the contact information applies to the document as a whole.
这意味着 <address>
元素并不意味着用于标记任何旧地址。这意味着您将使用 <address>
作为联系文章来源的一种方式。在一篇文章中,讨论“123 fourth street”不值得使用 <address>
元素。
如果您想将其描述为地址以用于样式目的,您总是可以给它一个 class
作为:
<span class="address">123 fourth street</span>
关于html - 为什么地址元素不能在 p 元素中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15953055/