如何修改bootstrap模态框的backdrop蒙版区域的颜色?
参考地址:
http://www.cnblogs.com/9miao/p/4988196.html
蒙板样式实现:
大家或许注意到了,在做模态弹出窗时,底部常常会有一个透明的黑色蒙层效果:在Bootstrap框架中为模态弹出窗也添加了一个这样的蒙层样式“modal-backdrop”,只不过他默认情况下是全屏黑色的: (## 注意这里是: .modal-backdrop, 而不是 .backdrop类!)/*bootstrap.css文件第5424行~第5432行*/同样,给其添加了一个过渡动画,从fade到in,把opacity值从0变成了0.5。上图展示的就是in状态下的效果:
.modal-backdrop { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1040;
background-color: #000; // 修改这里的颜色! backdrop蒙版区域本来的颜色是黑色的, 由于使用了透明度0.5, 所以就成了那种效果的了!
}
/*bootstrap.css文件第5433行~第5440行*/
.modal-backdrop.fade { filter: alpha(opacity=0); opacity: 0; }
.modal-backdrop.in { filter: alpha(opacity=50); opacity: .5; }