如何在淡入过程中删除bootstrap中模态的背景颜色？

Question

当我们在淡入淡出期间点击按钮时，背景颜色变为浅黑色，如图片中所示？我只是想要没有任何背景效果的模态（只是没有黑色部分的白色部分）所以我们怎样才能在bootstrap模式中禁用背景效果？

Answer 1

您必须降低背景的不透明度。 只需覆盖下面的CSS类

.modal-backdrop, .modal-backdrop.fade.in{
opacity: 0.1;
}

Answer 2

从http://getbootstrap.com/javascript/

中找到的引导程序文档中

  

选项可以通过数据属性或JavaScript传递。对于数据   属性，将选项名称附加到data-，如data-backdrop =＆＃34;＆＃34;

     

backdrop {boolean或字符串＆＃39;静态＆＃39;}默认值：true

     

包含模态背景元素。或者，为a指定static   在点击时不关闭模态的背景。

因此，只需将选项设置为false就可以完成

中的操作

$('#myModal').modal({
  backdrop: false
});

Answer 3

这是css技巧，我们需要覆盖bootstrap css，将以下代码放在你的模态div之上，根据你的id更改模态的id。

#myModal .modal-content{
background-color: rgba(0,0,0,0);
border: none;
}