如何增加Bootstrap模态宽度？

这里的CSS

body .modal-ku { 
width: 750px; 
}

，这里是失败的结果

来源

2015-12-01 Damara Jati P

在引导程序中，您可以使用modal-sm，modal-lg适用于小尺寸和大尺寸。 –

你能分享你的具体的HTML和CSS代码。某些样式可能会被覆盖 –

您可以分享您的完整代码或者您可以看到此示例，在此模型中宽度可以变化。 http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_modal&stacked=h –

在你的代码，对modal-dialog格，添加其他类，modal-lg：

<div class="modal-dialog modal-lg">

或者，如果你想你的居中模态对话框，使用：

.modal-ku { 
    width: 750px; 
    margin: auto; 
}

来源

2015-12-01 07:35:04

完美。保证金汽车为我工作。 –

在引导3，你需要改变模式，对话框。因此，在这种情况下，您可以在模态对话框所在的位置添加类modal-admin。

@media (min-width: 768px) { 
 
    .modal-dialog { 
 
    width: 600; 
 
    margin: 30px auto; 
 
    } 
 
    .modal-content { 
 
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, .5); 
 
      box-shadow: 0 5px 15px rgba(0, 0, 0, .5); 
 
    } 
 
    .modal-sm { 
 
    width: 300px; 
 
    } 
 
}

来源

2017-02-04 07:24:59 huageorg

-2

.your_modal { 
    width: 800px; 
    margin-left: -400px; 
}

保证金留下的价值是模式的宽度的一半。我用这与马鲁蒂管理的主题，因为它不具有类.modal-lg .modal-sm

来源

2017-05-31 07:32:06 SilumanSupra

的esiest方式可以在modal-dialog DIV内嵌样式：

<div class="modal" id="myModal"> 
    <div class="modal-dialog" style="width:1250px;"> 
     <div class="modal-content"> 
      ... 

     </div> 
    </div> 
</div>

来源

2017-07-19 07:09:32 Mudasir

所有关于响应全部的大惊小怪？ – carelesslyChoosy

我想这种情况是由于最大宽度的模态设置为500px，模态lg的最大宽度为800px我想将它设置为自动将使您的模态响应

来源

2018-02-22 11:21:24

如何增加Bootstrap模态宽度？

回答

相关问题