如何在不影响其他模态的情况下用CSS改变模态的宽度?

Bootstrap: How can I change a modal's width with CSS without affecting other modals?

本文关键字:模态 改变 CSS 情况下 影响 其他      更新时间:2023-09-26

我在我的应用程序中使用Bootstrap 3,它有几个模态。我希望模态具有不同的宽度,但我发现改变宽度的唯一方法是改变CSS中的modal-dialogmodal-content的值。如果我这样做,它也会改变其他模态的宽度。我找到的例子通常是一个模态,没有多大帮助。

使用:

this.$modal.open({
                templateUrl: 'Modal.tpl.html',
                controller: 'ModalCtrl'}
           );

模态是在一个html文件中定义的,我使用CSS对它进行样式化。

是否有一种方法,我可以有不同的模态宽度而不改变modal-dialogmodal-content的值?

我能够通过在$modal中定义"windowClass"属性来让它工作。开放的街区。我发现了另一个问题,它在不影响其他情态动词的情况下起作用:如何在Angular UI引导中增加模态宽度?

我是这样用的:

this.$modal.open({
                templateUrl: 'Modal.tpl.html',
                controller: 'ModalCtrl',
                windowClass: 'my-modal'}
           );

然后在css:

中指定模态的宽度
.my-modal .modal-dialog
{
    width:300px;
}