layui目录和项目引入

打酱油的；

已于 2023-08-20 16:54:31 修改

阅读量1.2k

点赞数

分类专栏：前端开发文章标签： layui css 前端

于 2023-05-16 15:37:23 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_46098612/article/details/130705465

版权

前端开发专栏收录该内容

21 篇文章

订阅专栏

1.目录结构如下

├─css //css目录
│ │─modules //模块css目录（一般如果模块相对较大，我们会单独提取，比如下面三个：）
│ │ ├─laydate
│ │ ├─layer
│ │ └─layim
│ └─layui.css //核心样式文件
├─font //字体图标目录
├─images //图片资源目录（目前只有layim和编辑器用到的GIF表情）
│─lay //模块核心目录
│ └─modules //各模块组件
│─layui.js //基础核心库
└─layui.all.js //包含layui.js和所有模块的合并文件

2. Layui环境搭建

项目引入

1
2
3

获得 layui 后，将其完整地部署到项目目录（或静态资源服务器），但是页面中只需要引入夏下面两个文件即可:
-- layui/css/layui.css
-- layui/layui.js   提示：如果是采用非模块化方式（最下面有讲解），此处可换成：layui/layui.all.js

注意事项

1	注意事项: 在向项目中引入Layui库的时候，一定要将官网下载的整个Layui压缩包中的layui文件夹整体引到项目中.

搭建实例

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <title>layui页面引入例子</title>
        <!-- css引入 -->
        <link rel="stylesheet" href="layui/css/layui.css">
    </head>
    <body>

        <!-- HTML代码 -->

        <!-- js引入 -->
        <script src="layui/layui.js"></script>
    </body>
</html>