【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>


相关推荐
vx_Biye_Design17 分钟前
flask学生课程笔记共享系统29026-计算机课程设计、毕业设计
java·javascript·spring boot·后端·elasticsearch·flask·课程设计
OpsEye42 分钟前
上线大模型只是第一步,用好 AI 离不开完整的成本管控
javascript·ai编程
骑着蜗牛撵大象3271 小时前
SpringBoot+Vue3 企业智能体侧挂架构:独立服务、独立数据库与主线零侵入落地
数据库·spring boot·架构·vue·springboot·事件驱动·服务拆分
Hilaku1 小时前
GraphQL 在国内为什么水土不服?
前端·javascript·程序员
夏幻灵2 小时前
前端八股:JavaScript 深拷贝详解:实现方式、递归原理与循环引用
开发语言·前端·javascript
suaizai_2 小时前
ComputerUse:让AI真正操控桌面系统
java·前端·javascript
ym hyd 1112 小时前
生鲜超市库存管理信息系统源码 Java+SpringBoot+Vue3 前后分离
java·开发语言·vue.js·spring boot·毕设
FYKJ_20102 小时前
express绿叶横店短剧推荐与影评分享平台34219-计算机课程设计、毕业设计
java·javascript·vue.js·spring boot·后端·课程设计·express
weishuangyun12 小时前
小程序制作平台怎么选?三大平台对比!
大数据·开发语言·javascript
Eric.462 小时前
毕设实战|SpringBoot+Vue 实现多个系统项目
vue.js·spring boot·课程设计