HTML iFrame - 标记或 CSS 中的大小？答案

【问题标题】：HTML iFrame - size in markup or in CSS?HTML iFrame - 标记或 CSS 中的大小？
【发布时间】：2014-05-14 11:04:37
【问题描述】：

那么这有什么不同吗：

<iframe src="iframe.html" width="100" height="100"></iframe>

还有这个：

<iframe src="iframe.html" style="width: 100px; height: 100px;"></iframe>

两者都在 HTML5 中受支持，我想知道哪个更好/推荐？有什么建议吗？

【问题讨论】：

这几乎是个人喜好，尽管我总是尽量坚持使用 CSS 解决方案...
我认为在网站加载后操作属性时会有区别，但对 css 的操作会调整大小
使用 CSS 来设置的样式（甚至包括滚动条）。看看<a href="/default/index/tourl?u=aHR0cDovL3d3dy53M3NjaG9vbHMuY29tL3RhZ3MvdGFnX2lmcmFtZS5hc3A%3D" rel="nofollow" target="_blank">w3schools.com/tags/tag_iframe.asp</a>
@Dryden Long 也许你是对的。这是我想到的第一件事。 @john Smith 你是什么意思？

标签： html css iframe markup

【解决方案1】：

就像 Dryden 提到了它真正的个人喜好。我倾向于坚持在我的样式表中使用类，而不是与 html 混合。对我来说似乎更干净。但是，将样式放在元素级别意味着您不能单独缓存 CSS 样式规则。通常将样式放在 CSS 文件中会允许缓存完成，从而减少每次加载页面时服务器的负载量。

【讨论】：

确实是我在使用外部.css文件，但是我添加了内联样式以减少代码量。
我的意思是我有时会使用内联样式...例如

【解决方案2】：

来自W3C：

“HTML 与 CSS 的分离使得网站的维护更容易，跨页面共享样式表，并根据不同的页面定制页面环境。这被称为结构分离（或：内容）来自演示文稿。”

但是，也有例外。如果您有页面外观的“原始版本”，您可以在标记中保留宽度和高度属性。然后，您可以使用 CSS 样式表覆盖原始高度和宽度。这在 img 标签的情况下是有意义的。请参阅以下问题：Should image size be defined in the img tag height/width attributes or in CSS?

【讨论】：

是的，也许我会为此使用 CSS 和内联 HTML 标记 - 因为它会被验证的标准所允许。

【解决方案3】：

在这种情况下，我建议使用内联，例如 for

<iframe src="iframe.html" width="100" height="100"></iframe>

因为如果 css 没有正确加载或被用户禁用，容器大小将是相同的。并且有利于避免跳块效应。

【讨论】：