还画啥网页啊，Layui框架不香吗

最新推荐文章于 2024-07-22 21:44:46 发布

Luka_Urbra

最新推荐文章于 2024-07-22 21:44:46 发布

阅读量230

点赞数

分类专栏：学习笔记文章标签： html

本文链接：https://blog.csdn.net/Luka_Urbra/article/details/111400413

版权

这篇博客介绍了Layui框架的使用，包括下载、导入和常用功能，如输入框验证，以及前端和后端的后台应用布局。使用Layui能简化前端开发，减少手动样式设置。

摘要由CSDN通过智能技术生成

教你如何开始使用Layui前端框架

Layui概述

经典模块化前端框架
由职业前端倾情打造，面向全层次的前后端开发者，低门槛开箱即用的前端 UI 解决方案

快速使用方式

下载地址

https://res.layui.com/static/download/layui/layui-v2.5.7.zip?v=1

导入

获得 layui 后，将其完整地部署到你的项目目录（或静态资源服务器），你只需要引入下述两个文件：

./layui/css/layui.css
./layui/layui.js

常用功能

输入框

<input type="text" name="title" required lay-verify="required" placeholder="请输入标题" autocomplete="off" class="layui-input">

其中
required：注册浏览器所规定的必填字段
lay-verify：注册form模块需要验证的类型
required：注册浏览器所规定的必填字段
lay-verify：注册form模块需要验证的类型
class=“layui-input”：layui.css提供的通用CSS类

后台应用布局

前端

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>layui-demo</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo">layui 后台布局</div>
    <!-- 头部区域（可配合layui已有的水平导航） -->
    <ul class="layui-nav layui-layout-left">
      <li

最低0.47元/天解锁文章

Luka_Urbra

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
还画啥网页啊，Layui框架不香吗

目录教你如何开始使用Layui前端框架Layui概述快速使用方式下载地址导入常用功能输入框后台应用布局前端后端总结教你如何开始使用Layui前端框架Layui概述经典模块化前端框架由职业前端倾情打造，面向全层次的前后端开发者，低门槛开箱即用的前端 UI 解决方案快速使用方式下载地址https://res.layui.com/static/download/layui/layui-v2.5.7.zip?v=1导入获得 layui 后，将其完整地部署到你的项目目录（或静态资源服务器），你只
复制链接

扫一扫

专栏目录