了解IFrame如何在网站设计中使用
当您在HTML中嵌入元素时，您有两种向其添加CSS样式的机会：
- 您可以设置IFRAME本身的样式。
- 您可以在IFRAME中设置页面的样式（在特定条件下）。
使用CSS来设置IFRAME元素的样式
在设计iframe时应考虑的第一件事就是IFRAME本身。 尽管大多数浏览器都包含没有多余样式的iframe，但添加一些样式以保持一致性仍然是个不错的主意。
以下是我总是包含在我的iframe中的一些CSS样式：
- 保证金：0;
- 填充：0;
- border：none;
- 宽度： 值 ;
- 身高： 价值 ;
将宽度和高度设置为适合我文档的大小。 下面是一个没有样式的框架示例，只有基本样式的框架示例。 正如您所看到的，这些样式大多只是删除iframe的边框，但它们也确保所有浏览器都显示具有相同边距，填充和尺寸的iframe。
HTML5建议您使用overflow属性来删除滚动条，但这不可靠。 所以如果你想删除或者更改滚动条，你也应该在你的iframe上使用滚动属性。 要使用滚动属性，请像添加其他任何属性一样添加它，然后从三个值中选择一个：yes，no或auto。 是告诉浏览器始终包含滚动条，即使它们不需要。 没有说删除所有滚动条，无论是否需要。
auto是默认设置，它们在需要时包含滚动条，当它们不需要时将其移除。
以下是如何关闭滚动属性的滚动功能：
scrolling =“no”>
这是一个iframe。
要关闭在HTML5中的滚动，你应该使用overflow属性。 但是，正如您在这些示例中看到的那样，它在所有浏览器中都无法可靠运行。
以下是您如何打开所有使用overflow属性滚动的方法：
style =“overflow：scroll;”>
这是一个iframe。
没有办法通过溢出属性完全关闭滚动。
许多设计师希望他们的iframe与他们所在页面的背景相融合，以便读者不知道iframe即使在那里。 但是你也可以添加样式来使它们脱颖而出。 调整边框以使iframe更容易显示。 只需使用边框样式属性（或其相关的边框顶部，边框右侧，边框左侧和底部边框属性）来设置边框的样式：
iframe {
border-top：＃c00 1px dotted;
border-right：＃c00 2px dotted;
border-left：＃c00 2px dotted;
border-bottom：＃c00 4px dotted;
}
但是你不应该停下来为你的风格进行滚动和边框。 您可以将许多其他CSS样式应用于您的iframe。 这个例子使用CSS3样式给iframe一个阴影，圆角，并旋转20度。
iframe {
margin-top：20px;
margin-bottom：30px;
-moz-border-radius：12px;
-webkit-border-radius：12px;
border-radius：12px;
-moz-box-shadow：4px 4px 14px＃000;
-webkit-box-shadow：4px 4px 14px＃000;
box-shadow：4px 4px 14px＃000;
-moz变换：旋转（20deg）;
-webkit变换：旋转（20deg）;
-o-变换：旋转（20deg）;
-ms变换：旋转（20deg）;
滤波器：的progid：DXImageTransform.Microsoft.BasicImage（旋转= 0.2）;
}
设计Iframe内容的样式
样式化iframe的内容就像设计其他任何网页一样。 但是，您必须有权编辑该页面 。 如果您无法编辑页面（例如，它在另一个网站上）。