如何调整模态高度？

问题描述：

我使用设备打开模态页面时出现问题。问题在于它正在填充页面而不是弹出。可能是什么问题？该模式在网络浏览器中弹出，但它在设备上打开，但它填充了页面。我该如何解决这个问题。顺祝商祺如何调整模态高度？

import {Component} from '@angular/core'; 
import {Network, Toast} from "ionic-native"; 
import {ModalPagePage} from '../modal-page/modal-page'; 
import {NavController, Platform,ModalController} from 'ionic-angular'; 

@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 

    public people: Array<Object>; 
    onDevice: boolean; 


    constructor(public navCtrl: NavController, public modalCtrl: ModalController) { 


    this.platform.ready().then(() => { 

     this.onDevice = this.platform.is('cordova'); 



    }); 

    } 




    presentProfileModal() { 
    let profileModal = this.modalCtrl.create(ModalPagePage); 

    profileModal.present(); 
    } 




}

模式演示文稿是在CSS中设置的，因此如果您希望我们提供帮助，您需要粘贴相关的HTML和CSS。 – codeepic

我认为Ionic是故意这么做的，因为让模态在较小的设备上拥有整个屏幕是很好的UX。 –

@codeepic modal-page.scss是：page-modal-page { width：50％; 身高：50％; }} 模态-page.html中是：我的自定义模态关闭离子按钮> ion-content> –

答

.modal-wrapper { 
    position: absolute !important; 
    width: 93vw !important; 
    height: 260px !important; 
    top: 0 !important; 
    bottom: 0 !important; 
    left: 0 !important; 
    right: 0 !important; 
    margin: auto !important; 
} 

.modal .backdrop { 
    display: block !important; 
}

结束在variable.scss骑模式的默认CSS。

如何调整模态高度？

相关推荐