<el-dialog :visible.sync="dialogVisible" center class="look_img_dia">
<img width="100%" :src="dialogImageUrl" alt="" />
</el-dialog>
.look_img_dia {
/deep/.el-dialog {
margin-top: 5vh !important;
width: -webkit-calc(~'80vw') !important;
width: -moz-calc(~'80vw') !important;
width: calc(~'80vw') !important;
height: -webkit-calc(~'90vh') !important;
height: -moz-calc(~'90vh') !important;
height: calc(~'90vh') !important;
.el-dialog__body {
box-sizing: border-box;
padding: 10px;
width: -webkit-calc(~'80vw') !important;
width: -moz-calc(~'80vw') !important;
width: calc(~'80vw') !important;
height: -webkit-calc(~'90vh - 100px') !important;
height: -moz-calc(~'90vh - 100px') !important;
height: calc(~'90vh - 100px') !important;
img {
width: 100% !important;
height: 100% !important;
object-fit: scale-down !important;
}
}
}
}
el-dialog弹框中img图片保持比例最大化;图片保持比例最大化
于 2022-10-14 16:22:21 首次发布