- layer 提供了强健的皮肤扩展属性,这意味着如果你对 layer 默认的样式不太满意,你还有更多的选择。
- 一:命名文件夹
- 在 layer 的 skin 目录建立一个文件夹,假设您将该文件夹命名为:yourskin
- 二:创建样式依赖文件
- 在 yourskin 文件夹下建立一个单独的样式文件,务必命名为:style.css。并且你可能用到的图片也要存放在该文件夹下
- 三:书写样式
- /*
- 通过 body 前缀,是为了确保你皮肤的优先级
- 你可以通过调试工具重置更多样式
- */
- body .layer-ext-yourskin .layui-layer-title{}
- body .layui-ext-yourskin .layui-layer-btn{}
- body .layui-ext-yourskin .layui-layer-btn a{}
- 四:调试
- 通过全局配置看看你的皮肤定义的如何:
- layer.config({
- extend: 'myskin/style.css', //加载您的扩展样式
- skin: 'layer-ext-yourskin'
- });
- layer.alert('layer 新皮肤');
- 五:应用
- 现在你已经成功制作了一个皮肤了,如果你觉得它很美,你可以放入项目中去使用。
- 1. 全局配置
- 见第四步
- 2. 局部使用
- layer.config({
- extend: 'myskin/style.css' //同样需要先加载新皮肤
- });
- //单个使用
- layer.open({
- skin: 'layer-ext-myskin' //只对该层采用 myskin皮肤
- });
- //也就是说,无论你全局还是局部,都要通过 layer.config 的 extend 来加载样式。
-