怎么自定义layer.open弹窗的样式？

1、首先来看layer弹窗的引用

下面是 layer 弹窗的 js，注意看

skin ：'自定义'

，都是通过 skin 的 CSS 来自定义样式。

1） layer 有内置的 skin 有：layui-layer-lan，layui-layer-molv；可以直接使用；

layer.open({
             		type:1,
             		offset:['120px','850px'] ,
                    title:"入库完成信息",
                    shade: 0, 					//遮罩透明度
                    maxmin: true, 				//允许全屏最小化
                    anim: 5, 					//0-6的动画形式，-1不开启
                    area: ['350px', '340px'], 	//宽高
                    resize:true,				//允许被拉伸
                    skin: 'layerdemo', 			//注意这里，靠这个css自定义样式！！！！！
                    scrollbar: false, //禁止滚动条 或者 弹窗页面》=页面大小，就没有滚动条))
                    content:$('#inmessage'),
                })
	};
           

2、通过layer.open弹窗的skin来定义CSS

注意点：

1）.layerdemo是自定义的，随便起

2）.layui-layer-title 是 layer 定义的，表示标题栏，不可修改；

3）.layui-layer-btn 也是layer定义的，不可修改，表示按钮；

body .layerdemo{	//设置弹窗的整体  
	border-radius: 10px;
	color:black;
}
body .layerdemo .layui-layer-title{	//设置弹窗的头部（标题栏）
	background:red;
}
body .layerdemo .layui-layer-btn{border-top:1px solid #E9E7E7}
body .layerdemo .layui-layer-btn a{background:#333;}
body .layerdemo .layui-layer-btn .layui-layer-btn1{background:#999;}
           

3、举例：设计 layer.open 弹窗样式为圆角

如下图，弹窗的样式：

自定义的 css ：

body .layerdemo{
	border-radius: 20px;
}

body .layerdemo .layui-layer-title{
	border-radius: 20px 20px 0 0;
}
           

就可以实现了。

推荐看下layer官网关于 skin 说明：

https://www.layui.com/doc/modules/layer.html#skin