带/不带引号的 HTML 属性答案

【问题标题】：HTML attribute with/without quotes带/不带引号的 HTML 属性
【发布时间】：2012-10-14 22:24:51
【问题描述】：

下面的代码块有什么区别吗？

<iframe src="http://example.com" width=100%></iframe>

<iframe src=http://example.com width="100%"></iframe>

我都试过了，两者似乎都有效，但我想问一下，以防万一有什么我需要小心的？

【问题讨论】：

这可能取决于您使用的浏览器和版本。（尤其是旧版浏览器）
相关：stackoverflow.com/questions/5398993/…

标签： html quotes

【解决方案1】：

除此之外没有实际区别

如果您验证您的页面，引号可能会也可能不会需要避免错误消息，具体取决于所使用的文档类型
如果您将带有 XML 内容类型的页面提供给浏览器（其中很少见且很少有用），则需要引号 - 否则该页面根本不显示，只是一条错误消息
如果页面以其他方式使用 XML 工具处理，则引号是必需的。

否则，仅当属性值包含空格、换行符、Ascii 引号 (")、Ascii 撇号 (')、重音符 (`)、等号 ( =)、小于号 ()。因此，style = width:20em 可以工作（尽管它可能看起来有些晦涩），而 style = width: 20em 则不行——由于空间的原因，你需要写style = "width: 20em"。

为简单起见，许多人总是在所有属性值周围加上引号。其他人认为引号使代码有点乱，所以他们尽可能省略它们。

与此完全无关，src="www.example.com" 表示相对 URL 引用，而不是人们期望的意思。你的意思可能是src="http://www.example.com"。

【讨论】：

【解决方案2】：

根据W3C有四种类型的属性语法：

空属性语法
不带引号的属性值语法
单引号属性值语法
双引号属性值语法

这些确实适用于 HTML5，但是在提及 W3C 表示根据所使用的文档类型（例如，严格、过渡等）需要引号（单引号或双引号） .

【讨论】：

报价要求不取决于使用的是严格还是过渡风格。它由标记方言决定：HTML 或 XHTML。

【解决方案3】：

不，两者都是一样的..

在 HTML 5 中，属性周围的引号只是可选的。（除非值包含空格或特殊字符）

但我觉得将它们括在引号中是一种更好的做法..

【讨论】：

最简单最好的答案。始终使用引号是一种更好的做法的感觉在网络社区中无处不在，但这只是一种感觉。对于“手工制作”的文档，它可能会大大减少错误，但如果要构建一个自动化的 HTML 最小化器，则可能希望在可能的情况下省略引号。

【解决方案4】：

不带引号的属性值语法

属性名称，后跟零个或多个空格字符，后跟单个 U+003D 等号字符，后跟零个或多个空格字符，然后是属性值，除了上面给出的要求外属性值，不得包含任何文字空格字符、任何 U+0022 引号字符 (")、U+0027 撇号字符 (')、U+003D 等号字符 (=)、U+003C 小于号字符 ( ) 或 U+0060 重音字符 (`)，且不得为空字符串。

来源：W3 HTML5 Specification - sec 8.1.2.3. Attributes

【讨论】：

【解决方案5】：

这是来自 Google - 最佳做法 - “最小化负载大小” https://developers.google.com/speed/docs/best-practices/payload （我的重点）

为确保您的内容能够很好地压缩，请执行以下操作： ... 对 HTML 标签属性使用一致的引用，即总是单引号，总是双引号，或根本不引用尽可能。

【讨论】：

【解决方案6】：

这一切都与 HTML 标记的真正有效性有关。它是为 W3C（WWW 联盟）工作的。许多事情可能在 HTML 中起作用，但它们必须经过验证才能被 Web 浏览器更仔细地识别。您甚至可以省略开头和结尾的<html> 和</html> 标签，但完全不建议这样做，没有人这样做，它被认为是“坏代码”。

因此，将它们放在引号中更有效。

【讨论】：

在 HTML5 之前的 HTML（专门的SGML）版本中，两者都有效。没有//假有效性//或//真有效性//；根据其DOCTYPE 声明，文件要么有效，要么无效。但是，它在 XHTML（XML 的应用程序）中无效。
请注意，呈现的 HTML 将包含引号