我正在为 html5 和 javascript 中的动态图创建一个应用程序。我希望屏幕上的 4 个图形在任何设备上显示为 4 个象限,此应用程序有效。这是我创建的代码
<!DOCTYPE HTML>
<html>
<head>
<iframe src = "file.html" height="500" width="500" align = "left" frameborder = "0"> </iframe>
<iframe src="file2.html" height="500" width="500" align = "middle" frameborder = "0"></iframe>
<iframe src="file3.html" height="500" width="500"align = "middle" frameborder = "0"></iframe>
<iframe src="file4.html" height="500" width="500"align = "middle" frameborder = "0"></iframe>
</head>
</html>
Run Code Online (Sandbox Code Playgroud)
是的,你可以提供height,并width在%对iframe中。虽然有一个问题。
如果你像这样给 iframe 提供 CSS
iframe {
width: 100%;
height: 100%;
}
Run Code Online (Sandbox Code Playgroud)
你会注意到只有width属性发生了变化,height属性不会发生任何变化。
要完成这项工作,您必须为heightiframe 的父项指定,在本例中为body和html. 所以你的 CSS 现在应该是
html,body{
height: 100%;
}
iframe{
width:60%;
height:70%
}
Run Code Online (Sandbox Code Playgroud)
现在heightiframe 中的更改将反映更改。
这是一个 小提琴
| 归档时间: |
|
| 查看次数: |
13152 次 |
| 最近记录: |