小白创建第一个LayUI项目

LayUI就是可以快速构建前端页面的,开发者只需要关注后端就可以了。

详细介绍可以看官网:https://www.layui.com/

主要看文档和示例。

但是如果是第一次用,看不懂这些文件应该放在哪里HTML页面也是显示不出来。

小白创建第一个LayUI项目

 

把layUI下载之后解压缩,然后拷贝到你项目如下目录中,这个HTML页面也要和他们放一起,因为示例中的路径是相对路径

这里以一个Maven创建的Javaweb项目目录结构为例:

小白创建第一个LayUI项目

这个testLayUI.html中的代码也是我从官网上复制的.大家可以测试一下自己第一个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>
  <link rel="stylesheet" href="../layui/css/layui.css">
</head>
<body>
 
<!-- 你的HTML代码 -->
 
<script src="../layui/layui.js"></script>
<script>
//一般直接写在一个js文件中
layui.use(['layer', 'form'], function(){
  var layer = layui.layer
  ,form = layui.form;
  
  layer.msg('Hello World');
});
</script> 
</body>
</html>

测试结果:

小白创建第一个LayUI项目

测试成功,搭建第一个LayUI项目成功.