在SweetAlert上更改图标图像大小
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了在SweetAlert上更改图标图像大小相关的知识，希望对你有一定的参考价值。
我正在尝试在SweetAlert上更改图标图像大小。在.css文件中，我看到：
.sweet-alert .sa-icon {
width: 80px;
height: 80px;
border: 4px solid gray;
-webkit-border-radius: 40px;
border-radius: 40px;
border-radius: 50%;
margin: 20px auto;
padding: 0;
position: relative;
box-sizing: content-box; }
我改变了这个值：
width: 80px;
height: 80px;
但不要改变任何东西。我的.png文件以预定的大小显示。建议？
答案
在控制器中使用“imageSize”对象类。
swal({ title: "Oops...",
text: "Please have a title and body in your post.",
imageUrl: "../../../img/oopsface.png",
imageSize: '600x600'
});
（如果您想以这种方式修改甜蜜警报，则需要使用此格式来调用警报）
另一答案
swal({
title: "Oops...",
text: "Please have a title and body in your post.",
imageUrl: "../../../img/oopsface.png",
//instead of imageSize use imageWidth and imageHeight
imageWidth: 600,
imageHeight: 600,
});另一答案
这对我来说可以。尝试删除.sa-icon。
.sweet-alert {
width: 80px;
height: 80px;
border: 4px solid gray;
-webkit-border-radius: 40px;
border-radius: 40px;
border-radius: 50%;
margin: 20px auto;
padding: 0;
position: relative;
box-sizing: content-box; }<img src="http://placehold.it/350x150" class="sweet-alert">另一答案
就我而言，我的img课程覆盖了imageWidth和imageHeight。为了解决这个问题，我必须在swal init上添加一个自定义类，如下所示：
swal({
title: "Title",
text: "Swal text",
imageUrl: "/example/image.png",
imageClass: "contact-form-image",
confirmButtonText:"Ok",
});
并在style.css上定义一个类：
.contact-form-image {
width: 144px;
height: 144px;
}
另一答案
'imageHeight'表示图像高度，'imageWidth'表示图像宽度
swal({
title: 'Alert!',
text: 'Content',
imageUrl: 'assets/images/user.png',
imageHeight: 80,
imageWidth: 80,
imageClass:'img-responsive rounded-circle',
animation: false
});
- 提醒标题的“标题”
- 警报内容的“文字”
- 'imageUrl'用于从网站嵌入图片网址
- 'imageHeight'用于图像尺寸（高度）
- 'imageWidth'用于图像大小（宽度）
- 'imageClass'为您的自定义图像类/其他类添加
html输出就像
<img src="assets/images/user.png" class="img-responsive rounded-circle" height="80" width="80" >
另一答案
我发现这可以解决我的问题
swal({
title: "Oops...",
text: "Please have a title and body in your post.",
imageUrl: "../../../img/oopsface.png",
//instead of imageSize use imageWidth and imageHeight
imageWidth: 600,
imageHeight: 600,
});以上是关于在SweetAlert上更改图标图像大小的主要内容，如果未能解决你的问题，请参考以下文章