【发布时间】:2020-06-15 20:44:47
【问题描述】:
我查看了 W3C 规范,但找不到 <a> 标记中允许的内容。我问这个是因为我在开发一个苗条的应用程序时遇到了一个奇怪的行为。在开发模式下,该应用能够将<th> 包装在<a> 中,如下所示:
<table>
<thead>
<tr>
<th>Services</th>
<a href="#details"><th>Details*</th></a>
<th>Coût</th>
</tr>
</thead>
</table>
我得到了预期的结果,一个带有书签链接到页面中另一个部分的可点击 th。
但是当我部署生产代码时,svelte 没有将<th> 包装在<a> 中。我还在codepen.io 中进行了一些测试(启用和禁用Javascript 注释以查看差异) 并惊讶地发现<th> 不能用<a> 本身包装,但是可以使用 Javascript 强制执行。
有没有一个地方可以找到<a> 标记中允许的元素列表,尽管任何东西都可以用一个包装。
谢谢!
【问题讨论】:
-
不是
a的内容;无效部分是在tr中有一个a,其唯一有效的内容是td和th。参见例如developer.mozilla.org/en-US/docs/Web/HTML/Element/…. -
@SamualCharpentier 你试过交换元素顺序吗?所以...
<th><a... -
虽然这不是您的问题,但请查看 MDN 在Properties 部分中的
<a>链接,并查看“允许的内容”。点击其中一些链接并阅读一些内容以回答您最后一句话中的问题。 -
是的,可以交换元素,但只有文本是可点击的,而不是形状。除非我做了
<a>display:block这是一个选项