element ui：el-dialog设置圆角

背景

el-dialog提示框在当前vue页面和main.css设置圆角样式都不起作用

原因

• 需要在 vue 页面或全局设置这个样式，这步骤没错
• 在当前 vue 页面设置样式时，需要去掉 scoped。因为它会给每个属性自动分配唯一属性，从而导致找不到（用了 /deep/ 也不行）
  比如：

<template>
    <el-dialog
      title="提示"
      :visible.sync="dialogVisible"
      width="30%"
      :custom-class="class1"
      :before-close="handleClose"
    >
      <span>这是一段信息</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
</template>


<style >
.class1 {
  border-radius: 100px;
}
</style>