我转过几个弯 绕过那个小雨楼
拿着蒲扇摆着衣衫渡着紧箍咒
不问天涯不停留 喝过几壶酒
不过年少白头道义放胸口
倘若明天之后 遥看前尘剑封侯
似那天上神仙无所求
朝朝暮暮君如梦醒十分不为何理由
是真是假是惶恐是无休
路过这风雨花满楼 片刻都不停留
我本这书生进京赶考留下许多愁
你问有没有时候 我叹这天道默悠悠
能否与我一醉方休
又过了几个弯 算尽天量道莫慌
踏这田园闻这芳草香
跌跌撞撞仗剑天涯折煞不枉无笔良
是梦是幻是温柔是家乡
路过这风雨花满楼 片刻都不停留
我本这书生进京赶考留下许多愁
你问有没有时候 我叹这天道默悠悠
能否与我一醉方休
路过这风雨花满楼 片刻都不停留
我本这书生进京赶考留下许多愁
你问有没有时候 我叹这天道默悠悠
能否与我一醉方休
谁能与我一醉方休
关于element的dialog垂直居中的完美解决方案
element的dialog弹窗,默认不是垂直居中的,只是水平居中,但是他有一个很好的地方,就是当窗口的高度小于dialog的高度时,他会有滚动条,并且可以完整的显示dialog,算是一个非常不错的兼容方式。
但是当我们对dialog进行css调整为垂直居中时,往往会使用下面两种样式:
绝对定位:
.el-dialog__wrapper {
position: relative;
.el-dialog {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
flex:
.el-dialog__wrapper {
display: flex;
justify-content: center;
align-items: center;
}
注意,在使用dialog垂直居中时,他的Attributes中top值需要设置为0,当然也可以手动css强行设置为0,看自己选择
两种方式都行,但是都有缺点。
绝对定位使用了transform
,这就会产生一个隐性的问题,当el-dialog里面有fixed定位是,就会发生定位失效的情况,所以,泛用性可能还是差一些,但是如果没有fixed定位,这个写法还是蛮好的。
flex的话,居中没问题,但是和绝对定位都有一个共同的问题,就是当页面高度小于dialog高度时,无法通过滚动条将dialong完整显示。
一时间也没想到啥解决方案,就一直放着,昨天跟同事聊,跟他讲了这个问题,然后她就去研究了,最后研究出来,我看了下,又百度了一些资料,大概明白是怎么回事。
她的代码是这样的:
此处内容已隐藏回复后方可阅读。
0
评论(0)