el-dialog设置宽度自适应
时间: 2023-11-21 12:52:24 浏览: 1542
自定义Dialog宽度
在使用elementUI的对话框el-dialog中,设置的默认宽度是百分比,比如width=“30%”,这样对话框会随着页面的宽度而自适应。如果我们只想要,无论页面有多宽,对话框都是固定的宽度,不随着页面的宽度而自适应,可以通过el-dialog的custom-class属性来实现。具体步骤如下:
1. 在el-dialog中加入custom-class属性,这个属性是给该对话框加一个专属的class。
2. 在style中写样式,记得要加/deep/(less中的用法),或::deep(普通的style中的用法) /deep/,设置对话框的宽度为固定值即可。
举个例子,如果我们想要设置一个宽度为480px的对话框,可以按照以下步骤进行设置:
1. 在el-dialog中加入custom-class属性,如custom-class="myDialog"。
2. 在style中写样式,如/deep/ .myDialog { width: 480px !important; }。
这样就可以实现el-dialog的宽度自适应了。
阅读全文