您现在的位置是:首页 > 技术教程 正文

el-dialog固定高度

admin 阅读: 2024-03-30
后台-插件-广告管理-内容页头部广告(手机)

el-dialog默认高度是自由拉伸的,当内容超过屏幕时会出现滚动条,按钮和标题都会随着滚动,用户体验不好。

依照elementUI文档给dialog添加了 custom-class 之后利用 ::v-deep 穿透,在css中添加以下代码就能实现高度超出了:

  1. .container-box{
  2. //弹出层的高度
  3. ::v-deep .el-dialog.import-dialog{
  4. height: auto;
  5. max-height: 80vh;
  6. overflow-y: auto;
  7. }
  8. //弹出层里内容的高度
  9. ::v-deep .el-dialog__body{
  10. max-height: 70vh!important;
  11. }
  12. }

标签:
声明

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

在线投稿:投稿 站长QQ:1888636

后台-插件-广告管理-内容页尾部广告(手机)
关注我们

扫一扫关注我们,了解最新精彩内容

搜索
排行榜