具体可参考官方文档: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. Linux GCC lib库相互引用,互相依赖(交叉引用)链接解决办法

    Linux GCC中,如果lib a依赖b,b又依赖a,链接的时候无论a放在前,还是b放在前,都会提示unrefrence. 解决办法就是: 链接的时候a链接两次,即: -la -lb -la

  2. linux进阶之Tomcat服务篇

    一.Tomcat简介 Tomcat服务器是一个免费的开放源代码的Web应用服务器,属于轻量级应用服务器,在中小型系统和并发访问用户不是很多的场合下被普遍使用,是开发和调试JSP程序的首选. Tomca ...

  3. 1 理解Linux系统的“平均负载”

    什么是平均负载 我们知道使用top或uptime可以用来了解系统的负载情况. uptime 2 02:34:03 up 2 days, 20:14, 1 user, load average: 0.6 ...

  4. 实操笔记:为 NSQ 配置监控服务的心路历程

    在 Go 语言实现的实时消息队列中, NSQ 的热度可以排第一. NSQ 这款消息中间件简单易用,其设计目标是为在分布式环境下运行,为去中心化服务提供一个强大的基础架构.它具有分布式.去中心化的拓扑结 ...

  5. 关于Ajax 的 cache 属性 (Day_34)

    最近做项目,在某些页面显示,ajax刷新总是拿不到新内容,时常需要清除缓存,才能到达想要的效果. 经过再次查看文档,最后加了一行属性:cache:false 即可解决问题 我们先看下文档的说明: 可以 ...

  6. 备份分区,备份文件切割保存 dd

    cd /tmp wget dl.fedoraproject.org/pub/epel/6/x86_64/dcfldd-1.3.4.1-4.el6.x86_64.rpm sudo yum install ...

  7. 痞子衡嵌入式:串行NAND Flash的两大特性导致其在i.MXRT FlexSPI下无法XiP

    大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是串行NAND Flash的两大特性导致其在i.MXRT FlexSPI下无法XiP. 在嵌入式世界里,当我们提起XiP设备(支持代码原地 ...

  8. 日常Bug排查-抛异常不回滚

    日常Bug排查-抛异常不回滚 前言 日常Bug排查系列都是一些简单Bug排查,笔者将在这里介绍一些排查Bug的简单技巧,同时顺便积累素材_. Bug现场 最近有人反映java应用操作数据库的时候,抛异 ...

  9. pika详解(五)登录认证及connectionParameters

    pika详解(五)登录认证及connectionParameters 本文链接:https://blog.csdn.net/comprel/article/details/94662916 版权 pi ...

  10. 华为4D成像雷达、智能驾驶平台MDC 810

    华为4D成像雷达.智能驾驶平台MDC 810 2020年10月底,华为发布了HI品牌,在今年2021年上海国际车展前夕,华为以 "专新致智" 为主题,举办HI新品发布会,发布了包括 ...