element-ui的el-dialog要如何更改弹出动画?
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
问题描述:用过el-dialog的都知道,它自身带的弹出动画,是距离顶部比较近,然后出现的很急促,观感上并不是很好。
解决办法:
如图所示,红框处要写的是你的dialog的custom-class,这个效果我自己写的,虽然简单,但是挺不错,就是缩放,比原本的那个舒服多了,大家可以去试试。vue项目(这里指的是vue 2.*)要修改element-ui的组件样式的话,要去App.vue中修改。
⚠️注意:初始的el-dialog带有默认样式margin-top:15vh; 所以看起来距离顶部较近,如果要靠屏幕中间显示的话,推荐margin-top:30vh !important;或者margin-top:35vh !important;要用!important覆盖掉原本的样式。这两种观感都比原本的dialog的位置要好上不少。
希望可以帮到各位!
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:3 个月前 )
c345bb45
7 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献3条内容
所有评论(0)