具体可参考官方文档:https://www.layui.com/doc/

由于引入layui 需要用到node.js

安装过程可参考:

https://www.cnblogs.com/liuchenxing/p/8036384.html

layui--入门(helloWorld) 

1.首先官网首页下载 layui  https://www.layui.com/

解压到指定目录(记住目录)

win+r 输入cmd 进入dos窗口 切换到解压目录

输入

npm install layui-src

如图:

回车。

执行成功。

解压目录下生成node_modules文件和package-lock.json文件。

获得layui之后,我们就进入使用。

点击进入node_modules目录,将layui-src当做项目导入静态服务器(我这里是用的HBuilder工具)

新建helloWorld.html

<!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="src/css/layui.css">
</head>
<body>

<!-- 你的HTML代码 -->

<script src="src/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--入门(helloWorld)的更多相关文章

  1. RabbitMQ学习总结 第二篇:快速入门HelloWorld

    目录 RabbitMQ学习总结 第一篇:理论篇 RabbitMQ学习总结 第二篇:快速入门HelloWorld RabbitMQ学习总结 第三篇:工作队列Work Queue RabbitMQ学习总结 ...

  2. Wix学习整理(1)——快速入门HelloWorld

    原文:Wix学习整理(1)--快速入门HelloWorld 1 Wix简介 Wix是Windows Installer XML的简称,其通过类XML文件格式来指定了用于创建Windows Instal ...

  3. CodeIgniter入门——HelloWorld

    原文:CodeIgniter入门--HelloWorld CodeIgniter(CI)是一套给PHP网站开发者使用的应用程序开发框架和工具包. 初次接触,来一个HelloWorld~~~ ^_^ 准 ...

  4. Flask入门HelloWorld

    Flask入门HelloWorld Flask官网:http://flask.pocoo.org/ Flask中文翻译:http://dormousehole.readthedocs.io/en/la ...

  5. Windows Eclipse Scala的入门HelloWorld

    [学习笔记] Windows Eclipse Scala的入门HelloWorld 有关带scala版本的eclipse4.7的下载, 你可以直接去: http://scala-ide.org/dow ...

  6. Springboot2.x入门——helloWorld

    Springboot2.x入门--helloWorld 一.简介 1.1 Springboot简介 Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的 ...

  7. idea创建Scala入门HelloWorld

    Scala开发环境的搭建 首先到Scala官网下载Scala网址为 https://www.scala-lang.org/download/ 找到下图所示位置:选择相对应的版本的Scala进行下载,这 ...

  8. Node.js开发入门—HelloWorld再分析

    在Node.js开发入门(1)我们用http模块实现了一个简单的HelloWorld站点,这次我们再来细致分析下代码.了解很多其它的细节. 先看看http版本号的HelloWorld代码: 代码就是这 ...

  9. 8086汇编语言入门-HelloWorld

    附件下载:  http://pan.baidu.com/s/1i5R9qO9    密码:rfgk 80x86微处理器汇编语言编程.学习任何编程语言都免不了要跨越HelloWorld这道坎,面向机器的 ...

  10. RabbitMQ 入门 Helloworld

    1.介绍 RabbitMQ 是信息传输的中间者.本质上,他从生产者(producers)接收消息,转发这些消息给消费者(consumers).换句话说,他能够按根据你指定的规则进行消息转发.缓冲.和持 ...

随机推荐

  1. [Python] 命名空间&作用域

    Python的类语句不会创建实例 类会创建命名空间,通过对象访问类的属性和方法 类不会创建作用域,对方法和属性的引用必须加以限定(如在方法中必须通过self引用实例的属性) class My1(): ...

  2. zabbix添加菜单栏

    1.更改字体(中文乱码多半是因为字体不支持中文) define('ZBX_GRAPH_FONT_NAME', 'DejaVuSans'); // font file name define('ZBX_ ...

  3. touch -d 同时修改atime与mtime

    1.touch命令 touch命令用于创建空白文件或设置文件的时间,格式为"touch [选项] [文件]". 在创建空白的文本文件方面,这个touch命令相当简捷,简捷到没有必要 ...

  4. Chrome 红色和 Chromium蓝色 区别:logoChrome 红色和 Chromium蓝色;Chrome闭源和 Chromium开源;

    我们知道Chromium采用的BSD开源协议(Chromium首页.文档和下载),google chrome是闭源的("9.2 根据第 1.2 条规定,除非法律明确允许或要求,或经谷歌明确书 ...

  5. LTC4020

    今天凯哥说他之前有一块电池放电低于20V了 然后接上4020后 会先浮充   涓流充 大约200ma  充过了20V后又是4A了

  6. [TcaplusDB知识库]TcaplusDB客户端及常用命令

    数据库大都支持命令行访问,TcaplusDB也不例外,通过安装TcaplusDB客户端,您可以方便快捷地从命令行管理与访问数据库. TcaplusDB客户端 首先在 TcaplusServiceApi ...

  7. 有关Git基础操作的学习

    Git简介 Git是一个免费的开源 分布式版本控制系统,旨在快速高效地处理从小型到大型项目的所有内容. Git 易于学习, 占地面积小,具有闪电般的快速性能.它具有诸如Subversion,CVS,P ...

  8. python类属性和实例属性的访问

  9. 痞子衡嵌入式:在SBL项目实战中妙用i.MXRT1xxx里SystemReset不复位的GPR寄存器

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是i.MXRT1xxx里SystemReset不复位的GPR寄存器的小妙用. 我们知道稍大规模的项目代码设计一般都是多人协作完成的,在项目 ...

  10. Sqlserver语句获取本周、上一周、本月数据

    sql语句获取本周.上一周.本月数据 获取周数据 1 本周 2 select * from table1 where datediff(week,时间字段,getdate()) = 0 3 上周 4 ...