一尘不染

可以使用HTML5在<a>内嵌套<button>元素吗?

html

我正在执行以下操作:

 <a href="www.stackoverflow.com">
   <button disabled="disabled" >ABC</button>
 </a>

这很好用,但是我收到一个HTML5验证错误,提示“元素’button’不能嵌套在元素’a button’中”。

谁能给我建议我该怎么做?


阅读 1049

收藏
2020-05-10

共1个答案

一尘不染

,根据W3C 的HTML5规范文,它不是有效的HTML5:

内容模型:
透明,但必须没有交互式内容后代。

只要其中没有交互内容(例如按钮或其他链接),该元素就可以包裹在整个段落,列表,表格等,甚至整个节中。

换句话说,您可以将<a>除以下内容之外的任何元素嵌套:

  • <a>

  • <audio>(如果存在 controls 属性)

  • <button>

  • <details>

  • <embed>

  • <iframe>

  • <img>(如果存在 usemap 属性)

  • <input>(如果 type 属性未处于 隐藏 状态)

  • <keygen>

  • <label>

  • <menu>(如果 type 属性处于 工具栏 状态)

  • <object>(如果存在 usemap 属性)

  • <select>

  • <textarea>

  • <video>(如果存在 controls 属性)


如果您尝试使用一个链接到某处的按钮,请将该按钮包装在<form>标签中,如下所示:

<form style="display: inline" action="http://example.com/" method="get">
  <button>Visit Website</button>
</form>

但是,如果您的<button>标签是使用CSS设置样式的,并且看起来不像系统的窗口小部件,请帮帮忙,为您的<a>标签创建一个新类,并以相同的方式对其进行样式设置。

2020-05-10