<!-- 显示弹窗 -->
<el-dialog
title="重大隐患"
:visible.sync="dialogVisible"
width="60%"
>
<!--插槽会替换title显示的内容 -->
<div slot="title" class="header-title">
<span v-show="dialogTitle" class="title-name">{{ dialogTitle }}</span>
</div>
<span>
<!-- <p>{{dialogContent}}</p> -->
<p class="newsDetail" v-html="dialogContent"></p>
</span>
</el-dialog>
data中变量:
dialogVisible:false,
dialogTitle:'',
dialogContent:'',
css样式:
::v-deep .el-dialog__header, {
background: #7a5c2a !important;
display: flex;
justify-content: center;
font-size: 43px;
span {
color: #fff;
font-weight: 700;
}
}
::v-deep .el-dialog__body {
background: #7a5c2a !important;
color: #fff;
text-indent: 2em;
font-size: 32px;
letter-spacing: 6px;
span {
p{
margin-bottom: 20px;
line-height: 50px;
}
}
}