修复 layer插件 在 bootstrap 4.x 下按钮颜色问题

弹出层插件 layer 在bootstrap 4.x 下使用时 按钮字体会变蓝色

修复方法:

在 layer\theme\  下添加个 样式文件  bootstrap4.css

/*修复layer 按钮文字颜色*/
.layui-layer-btn a:not([href]):not([tabindex]) {
    color: #fff
}

/*增加一个加载层样式，使用bootstrap4 的 spinner 旋转图标 */ 
.layui-layer-loading .layui-layer-loading3{
	min-width:100%; 
	background:#333; 
	filter: alpha(opacity=60);
	background-color: rgba(0,0,0,.5);
	border-radius: 2px;
}

使用前在js里先配置 ： layer.config({ path: '/lib/layer/', extend:'bootstrap4.css' });

例如

<script>
    layer.config({ path: '/lib/layer/', extend:'bootstrap4.css' });
    layer.alert('内容');
</script>

 

自定义的第三种加载层的使用方法：

<script>
    layer.load(3, {
        content: '<div class="spinner-border text-primary" role="status"><span class="sr-only">loading...</span></div><div>正在加载...</div>',
        shade: 0.1,
        skin: 'layui-layer-hui',
        area: ['200px', '80px']
    });
</script>