【element-ui】el-dialog改变宽度

dialog默认宽度为父元素的50%,这就导致在移动端会非常的窄,如图1,需要限定宽度。

解决方法:添加custom-class属性,然后在style中编写样式,注意 ,如果有scoped限定,需要加::v-deep

html 复制代码
<el-dialog
    title="XXXX"
    :visible.sync="dialogVisible"
    custom-class="customWidth">
</el-dialog>

<style scoped lang="scss">
 ::v-deep .dialogwidth{
    min-width: 300px;
  }
</style>


相关推荐
西洼工作室9 分钟前
前端接口安全与性能优化实战
前端·vue.js·安全·axios
大布布将军9 分钟前
《前端九阴真经》
前端·javascript·经验分享·程序人生·前端框架·1024程序员节
幸运小圣11 分钟前
for...of vs for 循环全面对比【前端JS】
开发语言·前端·javascript
_志哥_1 小时前
深度解析:解决 backdrop-filter 与 border-radius 的圆角漏光问题
前端·javascript·html
qiao若huan喜1 小时前
10、webgl 基本概念 + 坐标系统 + 立方体
前端·javascript·信息可视化·webgl
Crystal3282 小时前
App端用户每日弹出签到弹窗如何实现?(uniapp+Vue)
前端·vue.js
摸着石头过河的石头2 小时前
Service Worker 深度解析:让你的 Web 应用离线也能飞
前端·javascript·性能优化
molly cheung2 小时前
Vue3:watch与watchEffect的异同
vue.js·watch·store·watcheffect
不爱吃糖的程序媛3 小时前
Electron 如何判断运行平台是鸿蒙系统(OpenHarmony)
javascript·electron·harmonyos
Hilaku3 小时前
我用AI重构了一段500行的屎山代码,这是我的Prompt和思考过程
前端·javascript·架构