当前位置: 首页 > news >正文

Layui 使用

<i class="layui-icon layui-icon-face-smile"></i> 
<div>你可以去定义它的颜色或者大小,如:  <i class="layui-icon layui-icon-face-smile" style="font-size: 30px; color: #1E9FFF;"></i> 
</div>

定义图标的大小与颜色

格式:class = "layui-icon-...."

按钮

格式:class="layui-btn"

<div class="layui-btn-container"><button type="button" class="layui-btn">默认按钮</button><button type="button" class="layui-btn layui-bg-blue">蓝色按钮</button><button type="button" class="layui-btn layui-bg-orange">橙色按钮</button><button type="button" class="layui-btn layui-bg-red">红色按钮</button><button type="button" class="layui-btn layui-bg-purple">紫色按钮</button><button type="button" class="layui-btn layui-btn-disabled">禁用按钮</button>
</div><div class="layui-btn-container"><button class="layui-btn layui-btn-primary layui-border-green">主色按钮</button><button class="layui-btn layui-btn-primary layui-border-blue">蓝色按钮</button><button class="layui-btn layui-btn-primary layui-border-orange">橙色按钮</button><button class="layui-btn layui-btn-primary layui-border-red">红色按钮</button><button class="layui-btn layui-btn-primary layui-border-purple">紫色按钮</button><button class="layui-btn layui-btn-primary layui-border">普通按钮</button>
</div>

layui-btn-container 表示独占一行

按钮混搭
<div class="layui-btn-container"><button type="button" class="layui-btn layui-btn-lg layui-btn-primary layui-btn-radius">大型加圆角</button><a href="/" class="layui-btn" target="_blank">跳转的按钮</a><button type="button" class="layui-btn layui-btn-sm layui-btn-normal"><i class="layui-icon layui-icon-delete"></i> 删除</button><button type="button" class="layui-btn layui-btn-xs layui-btn-disabled"><i class="layui-icon layui-icon-share"></i> 分享</button>
</div>

class="layui-btn-... layui-btn..."

动画

 class="layui-anim" 基础类,在后面追加其他不同的动画类,即可让元素产生动画。

表单

通过 class="layui-form" 定义表单,通常设置在<form>标签上, 或普通<div> 标签

通过 class="layui-form-item" 定义一个块级元素的表单项容器

通过 class="layui-form-label" 定义标签

通过 class="layui-input-block" 定义表单项父容器为块级元素

通过 class="layui-input-inline" 或 class="layui-inline" 定义表单项父容器为行内块元素

layuimini修改

多模块

左侧是顶部的具体页面,如果关闭,就会只剩左侧折叠

菜单显示

在api的init.json中管理(添加删除)

图标

找fa-....开头的

Font Awesome Web 应用图标 | 菜鸟教程

页面管理配置

修改路径

显示页面效果

新增

用child包裹新增

注意:整体框架不要用{}

编写数据

(1)在api下创建 .json  根据需要编写数据

(2)找到数据所对应的页面,修改页面的url

(3)若修改数据类型,在页面中找到表格

        在script的table.rander下

        

注意:所有的引入类型,需要修改其路径

(4)在init.json的页面下配置html路径href,才能显示出来

页面转跳

从查询用户界面点添加用户,就会转跳到添加界面,在<script>的点击事件中

修改content的值

加红星的步骤

(1)找到css/public.css 

.layuimini-form > .layui-form-item > .required:after {content: '*';color: red;position: absolute;margin-left: 4px;font-weight: bold;line-height: 1.8em;top: 6px;right: 5px;
}

(2)将layuimini-form放在form表单

(3)在需要加星号的标签加入required

图表修改

饼图,柱状图,折线图都在option里修改

若从后端调取数据,data:[]是空,往里面赋值

在idea创建项目

修改url

1.在controller包下创建Servlet

String method = request.getParameter("method");if("queryUser".equals(method)){queryUser(request, response);}else {System.out.println("请求与后台不匹配");}

2.

request 能获取前台所有请求信息

response 把内容响应给浏览器

功能实现步骤:

1.在jsp

content

2.在userservlet.java

(1)在get方法中声明实现逻辑

(2)声明方法

3.在UserServiceImpl中声明delUser接口

4.在DAO层编写SQL语句

http://www.dtcms.com/a/414148.html

相关文章:

  • 如何优化 C# MVC 应用程序的性能
  • Uni-App 页面跳转监控实战:快速定位路由问题
  • Redisson的Lock和TryLock的区别
  • VLA技术论文阅读
  • find数组方法详解||Vue3 + uni-app + Wot Design(wd-picker)使用自定义插槽内容写一个下拉选择器
  • 怎么找做网站平台公司技术支持 湖北网站建设
  • 大型活动临时组网的技术解析:如何实现高效稳定的通信网络
  • 个人博客网站实验报告wordpress 页面新建
  • ZYNQ CAN接口全面解析:从裸机驱动到PetaLinux实战
  • AI 重构实体经济:2025 传统产业转型的实践与启示
  • 安宝特产品丨FME Realize:重构数据与现实的边界,让空间计算赋能现场决策
  • 第二篇: `nvidia-smi` (下) - 自动化监控与脚本
  • 配音与字幕不同步?音视频协同生成的技术原理与落地实践
  • p2p信贷网站建设永州网站建设优化
  • 批次标准化学习(第十六周周报)
  • .NET Core 中 System.Text.Json 与 Newtonsoft.Json 深度对比:用法、性能与场景选型
  • 高通平台 WLAN学习-- 性能优化优化实践:从代码层面解析 P2P 连接性能提升方案
  • 企业应该如何建设网站建立网站的信息集成过程
  • 做股权众筹的网站中国官网
  • 帆软Report11多语言开发避坑:法语特殊引号导致SQL报错的解决方案
  • ODPS SQL,对group by里每个group用python进行处理
  • (基于江协科技)51单片机入门:4.矩阵键盘
  • PPT auto Crorrector
  • MSSQL字段去掉excel复制过来的换行符
  • 学前端视频笔记
  • 【Navicat实现 SQL Server 异地 定时备份】
  • GitOps实战:ArgoCD+Tekton打造云原生CI/CD流水线
  • (基于江协科技)51单片机入门:3.静态数码管
  • 团支部智慧团建网站Wordpress调用搜索
  • 什么是ppm,ppb,ppt?