为什么 HTML5 不验证但也不提供替代方案？

Question

我不懂 HTML 5。验证器说：

iframe 元素上的 marginwidth 属性已过时。请改用 CSS。
iframe 元素上的 marginheight 属性已过时。改用 CSS。

但是根据this accepted answer：

无法在样式表中设置 iframe 的 marginheight、marginwidth 和 frameborder 属性。

他们为什么要我做一些不可能的事情？

要么将可行的东西放在规范中，要么提出一个真正的替代方案。他们似乎已经弃用了某些东西，而他们的替代方案不起作用。

我在这里错过了什么？

Answer 1

HTML5 规范确实描述了how the marginheight and marginwidth attributes work. 它所说的是：

对于下表中的每个属性，给定一个body元素，第一个 存在的属性映射到主体上的像素长度属性 元素。如果没有找到属性的任何属性，或者如果 无法成功解析找到的属性值， 那么默认值 8px 预计将用于该属性 而是。

Property        Source
'margin-top'    body element's marginheight attribute
                The body element's container frame element's marginheight attribute
                body element's topmargin attribute
'margin-right'  body element's marginwidth attribute
                The body element's container frame element's marginwidth attribute
                body element's rightmargin attribute
'margin-bottom' body element's marginheight attribute
                The body element's container frame element's marginheight attribute
                body element's bottommargin attribute
'margin-left'   body element's marginwidth attribute
                The body element's container frame element's marginwidth attribute
                body element's leftmargin attribute

如果body元素的Document的浏览上下文是嵌套浏览 上下文，以及该嵌套浏览的浏览上下文容器 context 是框架或 iframe 元素，然后是容器框架元素 body 元素是那个 frame 或 iframe 元素。否则，有 不是容器框架元素。

所以要达到同样的效果，你必须在被包含页面的body元素上设置CSS边距值，而不是iframe元素的CSS边距值。

该规范接着解释了为什么浏览器可能不（甚至不应该）支持 marginwidth 和 marginheight：

警告！ 上述要求意味着一个页面可以使用例如 iframe 来更改另一个页面（包括来自另一个来源的页面）的边距。这存在潜在的安全风险，因为在某些情况下，攻击可能会造成页面未按作者预期呈现的情况，可能是出于网络钓鱼或以其他方式误导用户的目的。

Answer 2

我倾向于说你应该始终对 W3C 的信息保持一点怀疑。

如果您想将其归结为文字 - 它们是正确的 - CSS 中没有 直接 等效项，但是，CSS 确实提供了现有的替代方案（这就是为什么仍然不支持这两个属性的原因，它们是多余的）。

marginheight 是上下边距，所以只需使用margin-top 和margin-bottom...marginwidth 也是如此，使用margin-left 和margin-right（或在@ 中一起指定） 987654327@)

至于frameborder——只需在CSS中设置iFrame的border即可。

<iframe marginheight='10' marginwidth=20' frameborder='0'>

可以用 HTML/CSS 实现：

<iframe>

iframe{
  margin:10px 20px;
  border:none;
}