gpt4 book ai didi

css - ionic 中的 ToastController 自定义位置

转载 作者:太空宇宙 更新时间:2023-11-03 22:30:47 31 4
gpt4 key购买 nike

我们正在创建 Ionic-Native 移动应用程序。我们正在使用 ToastController (ToastController)。我们使用了 position: 'top'。但是它与状态栏重叠。所以我们想要自定义位置。我们这样试过

let Errortoast = this.toastCtrl.create({
message: 'Please try again later',
duration: 3000,
cssClass: 'toast',
position: 'top'
});



.toast{
margin-top: 70px;
}

但运气不好。对自定义位置有什么想法吗?

最佳答案

您可以使用 transform: translateY(70px); 作为 CSS 属性来将 Toast 向下移动。

这是一个完整的代码示例:

你的页面.ts

this.toastCtrl.create({
message: 'Please try again later',
duration: 3000,
cssClass: 'yourClass',
position: 'top'
}).present();

你的页面.css

.yourClass {
.toast-wrapper {
transform: translateY(70px) !important;
}
}

注意:此 CSS 代码片段需要在 page CSS 之外,因为 .toast-wrapper 在页面之外。

关于css - ionic 中的 ToastController 自定义位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48640889/

31 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com