小编典典

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

all

我正在执行以下操作:

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

这很好用,但我收到一个 HTML5 验证错误,上面写着“元素’按钮’不能嵌套在元素’按钮’中。

谁能给我建议我应该做什么?


阅读 67

收藏
2022-07-12

共1个答案

小编典典

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

内容模型: 透明,但不能有交互式内容后代。

只要其中没有交互式内容(例如按钮或其他链接),a 元素可以围绕整个段落、列表、表格等,甚至整个部分。

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

  • <a>
  • <audio>(如果存在控制属性)
  • <button>
  • <details>
  • <embed>
  • <iframe>
  • <img>(如果存在usemap属性)
  • <input>(如果类型属性不处于隐藏状态)
  • <keygen>
  • <label>
  • <menu>(如果类型属性处于工具栏状态)
  • <object>(如果存在usemap属性)
  • <select>
  • <textarea>
  • <video>(如果存在控制属性)

如果您想要一个链接到某个地方的按钮,请将该按钮包装在<form>标签中,如下所示:

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

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

2022-07-12