更改twitter bootstrap模式中的背景颜色？

Question

在twitter bootstrap中创建模态时,有没有办法改变背景颜色？完全删除阴影？

注意:要删除着色,这不起作用,因为它还会更改单击行为.(我仍然希望能够在模态外单击以关闭它.)

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

Answer 1

通过以下方式更改颜色:

CSS

在引导样式之后将这些样式放在样式表中:

.modal-backdrop {
   background-color: red;
}

减

将bootstrap-variables更改为:

@modal-backdrop-bg:           red;

资源

萨斯

将bootstrap-variables更改为:

$modal-backdrop-bg:           red;

资源

引导,定制

更改@modal-backdrop-bg为您想要的颜色:

getbootstrap.com/customize/

您也可以通过Javascript或将颜色设置为删除背景transparent.

Answer 2

如果要更改特定模式的背景幕背景颜色,可以通过以下方式访问背景幕元素:

$('#myModal').data('bs.modal').$backdrop

然后你可以通过.css jquery函数更改任何css属性.特别是有背景:

$('#myModal').data('bs.modal').$backdrop.css('background-color','orange')

请注意,必须初始化$('#myModal'),否则$ backdrop将为null.同样适用于bs.modal数据元素.

Answer 3

CSS

如果这不起作用:

.modal-backdrop {
   background-color: red;
}

试试这个:

.modal { 
   background-color: red !important; 
}

Answer 4

删除引导模态背景试试这个

.modal-backdrop {
   background: none;
}