带/不带引号的 HTML 属性
Posted
技术标签:
【中文标题】带/不带引号的 HTML 属性【英文标题】：HTML attribute with/without quotes 【发布时间】：2012-10-14 22:24:51 【问题描述】：下面的代码块有什么区别吗？
<iframe src="http://example.com" width=100%></iframe>
<iframe src=http://example.com ></iframe>
我都试过了，两者似乎都有效，但我想问一下，以防万一有什么我需要小心的？
【问题讨论】：
这可能取决于您使用的浏览器和版本。 （尤其是旧版浏览器） 相关：***.com/questions/5398993/… 【参考方案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，但是在提及
【讨论】：
报价要求不取决于使用的是严格还是过渡风格。它由标记方言决定：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 将包含引号以上是关于带/不带引号的 HTML 属性的主要内容，如果未能解决你的问题，请参考以下文章