afa*_*f12 7 html cordova ionic-framework ionic
我想要一个iframe来填充导航栏下方的所有空间.我看到Ionic正在生成内联CSS并向html,body标签添加类,它还创建了div包装器.我不知道达到我想要的目的是什么.我需要为此使用一些预制的CSS类,还是自己编写?如果是这样,我该怎么做,不打破布局.
问题不是关于iframe,而是关于让容器填满导航栏下面的整个空间.
目前iframe占据全宽但只有150像素的高度,因为父容器的高度为150px.
我的应用程序基于(github的标签应用程序).
我的代码如下:
index.html的:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
</head>
<body ng-app="starter">
<ion-nav-bar class="bar-stable">
<ion-nav-back-button>
</ion-nav-back-button>
</ion-nav-bar>
<ion-nav-view style="width: 100%; min-height: 100%; height: 100%;">
<!-- tab-map is shown here: -->
</ion-nav-view>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
制表map.html:
<ion-view view-title="Map" style="width: 100%; min-height: 100%">
<div style="width: 100%; min-height: 100%">
<ion-content class="padding" >
<iframe src="../index.html" style="width: 100%; min-height: 100%">
</iframe>
</ion-content>
</div>
</ion-view>
Run Code Online (Sandbox Code Playgroud)
目前它看起来像这样:

小智 20
这条CSS线为我解决了问题:
.scroll{height: 100%;}
Run Code Online (Sandbox Code Playgroud)
小智 5
我认为这更好,因为它适应内容:
在ion-content中包含ion-nav-view并将此属性放入ion-content标记中
overflow-scroll="true"
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
24678 次 |
| 最近记录: |