element-ui如何修改el-dialog的样式?

要修改dialog的样式不能直接在<style scoped>中修改,这样修改后不会生效。做法是把scoped去掉,然后在dialog标签上自定义一个class,最好不要和其他的class同名,然后通过此class选择器再去修改里面的相关样式即可。

<template>
   <el-dialog 
        title="信息" 
        :visible.sync="dialogFormVisible" 
        width="60%" 
        class="my-info-dialog">

        我是弹框

    </el-dialog>
</template>
<style>
.my-info-dialog .el-dialog__body {
        padding: 0px;
    }
</style>    

上例是修改弹框中内容距离标题的距离。

上一篇:element-UI 弹出组件的遮罩层在弹出层dialog模态框的上面解决方案


下一篇:【Android初级】如何实现一个具有选择功能的对话框效果(附源码)