4

根据 W3C 关于 HTML 语义编写的规则，我没有意识到这是否不好 - 我们应该如何编写button带有下降元素的元素？

顺便说一句，像这样：

<button>
 <div>
   <span>'hi'</span>
 </div>
</button>

或者只有这个：

<button>'hi'</button>
4

4 回答 4

5

我在W3C Validator中测试了您的代码，显示的错误是Element div not allowed as child of element button in this context. (Suppressing further errors from this subtree.)

W3C 验证器结果

于 2018-10-29T09:29:08.123 回答
2

基本上规范不允许这样做。

它可能对您有用，但这不是最佳做法。

正如您在此处看到的，按钮必须是没有交互式内容的后代。

您也可以在这里验证您的 html

于 2018-10-29T09:27:51.567 回答
2

<button>a中的嵌套标签无效，并在测试时返回以下内容：

在此上下文中，不允许元素 div 作为元素按钮的子元素。

非嵌套标签是正确的方法。

喜欢就自己看吧。我使用以下 HTML 进行测试：

<!DOCTYPE html>
<html lang="en"> 
<head> 
<title>Button test HTML</title> 
</head>
<body>
<button>
<div>
   <span>'not valid'</span>
 </div>
</button>
<button>Valid</button>
</body>
</html>
于 2018-10-29T09:32:18.003 回答
1

button元素可能包含短语内容而不是交互式内容的元素。换句话说：在段落内级别上使用的元素（有时称为内联元素），并且不允许用户交互。

例如，这意味着它可能包含span元素，但不包含div元素。所以这是有效的：

<button>
  <span>'hi'</span>
</button>
于 2018-10-29T12:50:49.107 回答