这篇博客详细介绍了如何使用CSS自定义`.v-modal`和`.el-dialog__wrapper`的背景颜色，以及如何设置`.el-dialog`的阴影效果、垂直居中和边距。通过设置`transform: translate(-50%, -50%)`实现弹窗的水平垂直居中，并通过调整`box-shadow`属性来改变弹窗的阴影表现。这为前端开发者提供了自定义对话框样式的实用技巧。
.v-modal {
background-color: transparent;
}
.el-dialog__wrapper {
// background-color: rgba(0, 0, 0, .48);
}
/deep/ .el-dialog {
box-shadow: 0 0 10px 0 rgba(51, 53, 64, .12); // 弹窗阴影
// 弹窗垂直居中
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
margin: 0 !important;
}
扫一扫
6339
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
