SweetAlert - 更改模态宽度？

Question

我喜欢这个图书馆。我想用它在我的一个网页上显示适度的响应表，但文本有点宽。我希望有一个选项可以更改我在 SweetAlert 中显示表格的页面的整体警报宽度，但我没有任何运气。表格和 HTML 看起来不错，只是模态的信息太多了。

我什至找不到在整个 sweetalert.css 中设置宽度的位置。

我想也许 customClass 配置键可能有帮助，我试过了：

 swal({
       title: priorityLevel +' Issues for '+appName,
       html: appHTML,
       type: "info",
       customClass: 'swal-wide',
       showCancelButton: true,
       showConfirmButton:false
   });

css 很简单：

 .swal-wide{
    width:850px;
}

这没有做任何事情。任何人都知道如何做到这一点，或者可能玩过 width 元素？

谢谢！

原文由 Watercayman 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

尝试将 !important 像这样放在 css 中：

 .swal-wide{
    width:850px !important;
}

看到它在片段中工作。

 function TestSweetAlert(){
    swal({
       title: 1 +' Issues for test',
       text: "A custom <span style='color:red;'>html</span> message.",
       html: true,
       type: "info",
       customClass: 'swal-wide',
       showCancelButton: true,
       showConfirmButton:false
   });
};

$('#testeSWAL').on("click",TestSweetAlert);

 .swal-wide{
    width:850px !important;
}

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet"/>

<button id="testeSWAL"> Test SWAL </button>

注意：也许你会遇到职位问题。

原文由 Joel R Michaliszen 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

在最新版本中，您可以使用：

width: '800px'

IE：

 swal({
    title: "Some Title",
    html: "<b>Your HTML</b>",
    width: '800px'
})

---

Sweet Alert2 文档

原文由 Pedro Lobito 发布，翻译遵循 CC BY-SA 4.0 许可协议