提交部分预先设计网页页面

lqs_branch
lqs 1 year ago
parent f5529f0628
commit 3489f5ed4d

@ -0,0 +1,122 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>校园失物招领平台</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #f5f5f5;
}
header {
background-color: #ff6f61;
color: #fff;
padding: 20px 0;
text-align: center;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}
header h1 {
margin: 0;
font-size: 36px;
}
nav {
background-color: #ff9d8e;
text-align: center;
padding: 10px 0;
}
nav a {
color: #fff;
text-decoration: none;
margin: 0 20px;
font-size: 20px;
}
.content {
display: flex;
justify-content: space-between;
padding: 20px;
}
.search-box {
flex: 1;
padding: 20px;
background-color: #fff;
border: 1px solid #e0e0e0;
border-radius: 10px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}
.search-box h2 {
font-size: 28px;
margin-bottom: 20px;
color: #333;
}
.search-box input[type="text"] {
width: 100%;
padding: 15px;
border: 2px solid #e0e0e0;
border-radius: 5px;
font-size: 18px;
outline: none;
}
.search-box button {
background-color: #ff6f61;
color: #fff;
border: none;
border-radius: 5px;
padding: 15px 25px;
font-size: 20px;
cursor: pointer;
}
.search-results {
flex: 2;
padding: 20px;
background-color: #fff;
border: 1px solid #e0e0e0;
border-radius: 10px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}
.search-results h2 {
font-size: 28px;
margin-bottom: 20px;
color: #333;
}
</style>
</head>
<body>
<header>
<h1>校园失物招领平台</h1>
</header>
<nav>
<a href="#"><i class="fas fa-search"></i> 失物</a>
<a href="#"><i class="fas fa-upload"></i> 失物发布</a>
<a href="#"><i class="fas fa-hand-holding"></i> 招领</a>
<a href="#"><i class="fas fa-plus"></i> 招领发布</a>
<a href="#"><i class="fas fa-images"></i> 图片匹配</a>
<a href="#"><i class="fas fa-bars"></i> 导航</a>
</nav>
<div class="content">
<div class="search-box">
<h2>失物信息搜索</h2>
<input type="text" placeholder="输入关键词">
<button>搜索</button>
</div>
<div class="search-results">
<h2>搜索结果</h2>
<!-- 这里显示搜索结果的详细信息和图片 -->
</div>
</div>
</body>
</html>

@ -0,0 +1,122 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>失物招领网站</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin: 0;
padding: 0;
background-color: #f5f5f5;
}
header {
background-color: #ff6f61;
color: #fff;
padding: 20px 0;
text-align: center;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
}
header h1 {
margin: 0;
font-size: 36px;
}
nav {
background-color: #ff9d8e;
text-align: center;
padding: 10px 0;
}
nav a {
color: #fff;
text-decoration: none;
margin: 0 20px;
font-size: 20px;
}
.content {
display: flex;
justify-content: space-between;
padding: 20px;
}
.search-box {
flex: 1;
padding: 20px;
background-color: #fff;
border: 1px solid #e0e0e0;
border-radius: 10px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}
.search-box h2 {
font-size: 28px;
margin-bottom: 20px;
color: #333;
}
.search-box input[type="text"] {
width: 100%;
padding: 15px;
border: 2px solid #e0e0e0;
border-radius: 5px;
font-size: 18px;
outline: none;
}
.search-box button {
background-color: #ff6f61;
color: #fff;
border: none;
border-radius: 5px;
padding: 15px 25px;
font-size: 20px;
cursor: pointer;
}
.search-results {
flex: 2;
padding: 20px;
background-color: #fff;
border: 1px solid #e0e0e0;
border-radius: 10px;
box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
}
.search-results h2 {
font-size: 28px;
margin-bottom: 20px;
color: #333;
}
</style>
</head>
<body>
<header>
<h1>失物招领网站</h1>
</header>
<nav>
<a href="#"><i class="fas fa-search"></i> 失物</a>
<a href="#"><i class="fas fa-upload"></i> 失物发布</a>
<a href="#"><i class="fas fa-hand-holding"></i> 招领</a>
<a href="#"><i class="fas fa-plus"></i> 招领发布</a>
<a href="#"><i class="fas fa-images"></i> 图片匹配</a>
<a href="#"><i class="fas fa-bars"></i> 导航</a>
</nav>
<div class="content">
<div class="search-box">
<h2>招领信息搜索</h2>
<input type="text" placeholder="输入关键词">
<button>搜索</button>
</div>
<div class="search-results">
<h2>搜索结果</h2>
<!-- 这里显示搜索结果的详细信息和图片 -->
</div>
</div>
</body>
</html>

@ -0,0 +1,232 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<div
class="relative w-[90rem] overflow-hidden flex flex-col gap-2.5 pt-8 justify-start items-start h-fit bg-white"
>
<div
class="relative self-stretch h-[4.5rem] overflow-hidden flex flex-col px-20 justify-center items-center w-fit"
>
<div
class="relative self-stretch flex gap-8 justify-between items-center w-fit h-fit"
>
<div
class="relative flex gap-[3.75rem] justify-start items-center w-fit h-fit"
>
<div class="relative w-24 h-10 rounded-md">
<div
class="absolute left-[0.1875rem] top-[0.1875rem] text-left text-[1.3749999999999991rem] font-['Kalam'] font-bold text-[#1d2129]"
>
CAUC
</div>
</div>
<div
class="relative flex gap-8 justify-start items-start w-fit h-fit"
>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
用户登录
</div>
</div>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
管理员登录
</div>
</div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
</div>
</div>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACgSURBVFiF7dZBDoIwEAXQPz0HEmWFnqKeTDiZPYWwAgOeo3XBlthRSiDmv/Vk/qRJpwWIiIj+mmgL8+JShRBuyYJF6qF7VNE6bcPD6RwWTTRj7JtovtE2E5F62Tjr9iNai/oWA9OqSRHqvXcA8Hq2Llb7zZq5A7C/DjXDjX1zjRWp18xW1CeYHUsLAMYYmyJY84oQ7QG/W5/wu0VERLR/byYuKx4pTRcbAAAAAElFTkSuQmCC"
class="relative w-10 h-10"
/>
</div>
</div>
<div
class="relative w-[89rem] flex gap-2.5 pl-[4.474999904632568rem] justify-start items-start h-fit"
>
<div
class="relative flex-1 flex gap-2.5 py-10 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex flex-col gap-4 pt-[17.939844131469727rem] pr-[32.087499141693115rem] pb-[17.935155868530273rem] pl-[32.100000858306885rem] justify-center items-center h-fit w-fit"
>
<div
class="relative w-44 flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative text-left text-3xl font-['SourceHanSansCN'] font-normal text-gray-900 leading-9 whitespace-nowrap"
>
校园失物招领
</div>
</div>
<div
class="relative w-[7.5rem] flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-center w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2 justify-center items-center w-fit h-fit"
>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAKQSURBVFiFzVc7TxtBEP5mcsQNFpbSOeCSyo+GIpEiy5FwROE4SYULk1+QSOE/pEsBUvwLgMJUIOOCCEsgCym0flTQmeDaPJrYZieFHxwOPnbts5Kvudubnf0+7ezOzRA0kYzX/ExWQiBRACFAAgD5OlZpAFQDUCFQUUk7nzsI1HXWpccmvF389YKZvgBY1hXbxbZSsr5XmD0ZSUAsdmj5pubXhPDJkPg+gSDTaJ2uHh29bmsLSC6dh6Fog0CRcch7EEgJLB9z+3PlRwV8WKy/Uow8IDNukNuoLlkhsVPwHw8VkFw6D5N6UnSf/E6E8G3UvhPce4nFDi0o2pgcOQDIDBRtxGKH1l8CfFPza27F3AkEivim5tfuxuhftZ+6iwTDHqRWpvvv2a1rZDevjYQoJS/3CrMnDADde66Nr9+eIRj2IBj2AABSaS92f/j7Yx30ODkZr/lhkGRSK14H27S2AADLyXjNz0xWwsQrlR4uwBRMVoK7uV0b1fLvoTaTEACAQKIMIGTk5YDsltlBBBDizl/NgGTzxsFmKkAC9O7NhRh6AegcxlTa2w9JdvPGMTzDMLIAt2B1iwmfiVMw7EEw8vTet2qpOcIOSMPqVjJaAnrb/iDSnYdZVqQaA6iMTW6fl/Y6JqsBVJhARbfI7SJ0cgKBiqykndde2QA6aVlJO8/d6nXbcTEX068N27mDQJ0BQClZd5o5QoZDtdx0tPc4+yXZ+/jF93ErYF2QILN78PwzYKuIGq3TVYGUJk0ukFKjdbraF2M3/tOiFABy+3NlVkgAdDkJclZIDPYGPDhtp+A/Fr6NuhkOgZSEb6ODPcGDAoDOTlw1zxZIkBmXnASZq+bZwkNdEfA/N6eDmFR7/gdDEBWzU3/XOAAAAABJRU5ErkJggg=="
class="relative w-8 h-8"
/>
<div
class="relative w-20 flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative text-left text-xl font-['SourceHanSansCN'] font-normal text-gray-900 leading-7"
>
用户注册
</div>
</div>
</div>
</div>
</div>
<div
class="relative w-[15.8125rem] flex flex-col gap-2.5 pt-[1.5499992370605469rem] pr-[1.5125007629394531rem] pb-[1.462503433227539rem] pl-[1.5499992370605469rem] justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-2xl"
>
<div
class="relative self-stretch flex flex-col gap-4 justify-start items-start h-fit w-fit"
>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[12.749999809265137rem] flex gap-2.5 pt-2 pr-[0.8000000000000007rem] pb-[0.5249999999999999rem] pl-3 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[11.2rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入账号
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[12.749999809265137rem] flex gap-2.5 pt-2 pr-[0.8000000000000007rem] pb-[0.5249999999999999rem] pl-3 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[11.2rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入密码
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[12.749999809265137rem] flex gap-2.5 pt-2 pr-[0.8000000000000007rem] pb-[0.5249999999999999rem] pl-3 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[11.2rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请确认密码
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.725002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-start w-fit h-fit"
>
<div
class="relative w-[3.25rem] flex gap-2.5 py-1.5 px-3 justify-center items-start h-fit bg-blue-500 rounded-md"
>
<div
class="relative text-center text-sm font-['SourceHanSansCN'] font-normal text-white leading-5"
>
注册
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.600002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 h-5 flex gap-2.5 justify-center items-start w-fit"
></div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.600002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-start w-fit h-fit"
>
<div
class="relative w-14 h-5 flex gap-2.5 justify-start items-start"
></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="relative self-stretch overflow-hidden flex flex-col gap-[3.75rem] p-20 justify-start items-center h-fit w-fit"
>
<div
class="relative self-stretch flex flex-col gap-8 justify-start items-start h-fit w-fit"
>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQAAAAABCAYAAACBgAP1AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAAiSURBVFiF7cFBEQAABAAw+ifz8NOHHm5bVs8GAAAAAPDSAVqMA2uFxRa7AAAAAElFTkSuQmCC"
class="relative self-stretch h-[0.0625rem]"
/>
<div
class="relative self-stretch flex gap-16 justify-between items-start w-fit h-fit"
>
<div
class="relative text-left text-sm font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-5"
>
©2023 产品版权所有。保留所有权利。
</div>
<div
class="relative w-[21.5625rem] h-5 flex gap-6 justify-end items-start"
></div>
</div>
</div>
</div>
</div>
</body>
</html>

@ -0,0 +1,215 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<div
class="relative w-[90rem] overflow-hidden flex flex-col gap-2.5 pt-8 justify-start items-start h-fit bg-white"
>
<div
class="relative self-stretch h-[4.5rem] overflow-hidden flex flex-col px-20 justify-center items-center w-fit"
>
<div
class="relative self-stretch flex gap-8 justify-between items-center w-fit h-fit"
>
<div
class="relative flex gap-[3.75rem] justify-start items-center w-fit h-fit"
>
<div class="relative w-24 h-10 rounded-md">
<div
class="absolute left-[0.1875rem] top-[0.1875rem] text-left text-[1.3749999999999991rem] font-['Kalam'] font-bold text-[#1d2129]"
>
CAUC
</div>
</div>
<div
class="relative flex gap-8 justify-start items-start w-fit h-fit"
>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
用户登录
</div>
</div>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
管理员登录
</div>
</div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
</div>
</div>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACgSURBVFiF7dZBDoIwEAXQPz0HEmWFnqKeTDiZPYWwAgOeo3XBlthRSiDmv/Vk/qRJpwWIiIj+mmgL8+JShRBuyYJF6qF7VNE6bcPD6RwWTTRj7JtovtE2E5F62Tjr9iNai/oWA9OqSRHqvXcA8Hq2Llb7zZq5A7C/DjXDjX1zjRWp18xW1CeYHUsLAMYYmyJY84oQ7QG/W5/wu0VERLR/byYuKx4pTRcbAAAAAElFTkSuQmCC"
class="relative w-10 h-10"
/>
</div>
</div>
<div
class="relative w-[89rem] flex gap-2.5 pl-[4.474999904632568rem] justify-start items-start h-fit"
>
<div
class="relative flex-1 flex gap-2.5 py-10 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex flex-col gap-4 pt-[17.939844131469727rem] pr-[32.087499141693115rem] pb-[17.935155868530273rem] pl-[32.100000858306885rem] justify-center items-center h-fit w-fit"
>
<div
class="relative w-44 flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative text-left text-3xl font-['SourceHanSansCN'] font-normal text-gray-900 leading-9 whitespace-nowrap"
>
校园失物招领
</div>
</div>
<div
class="relative w-[7.5rem] flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-center w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2 justify-center items-center w-fit h-fit"
>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAKQSURBVFiFzVc7TxtBEP5mcsQNFpbSOeCSyo+GIpEiy5FwROE4SYULk1+QSOE/pEsBUvwLgMJUIOOCCEsgCym0flTQmeDaPJrYZieFHxwOPnbts5Kvudubnf0+7ezOzRA0kYzX/ExWQiBRACFAAgD5OlZpAFQDUCFQUUk7nzsI1HXWpccmvF389YKZvgBY1hXbxbZSsr5XmD0ZSUAsdmj5pubXhPDJkPg+gSDTaJ2uHh29bmsLSC6dh6Fog0CRcch7EEgJLB9z+3PlRwV8WKy/Uow8IDNukNuoLlkhsVPwHw8VkFw6D5N6UnSf/E6E8G3UvhPce4nFDi0o2pgcOQDIDBRtxGKH1l8CfFPza27F3AkEivim5tfuxuhftZ+6iwTDHqRWpvvv2a1rZDevjYQoJS/3CrMnDADde66Nr9+eIRj2IBj2AABSaS92f/j7Yx30ODkZr/lhkGRSK14H27S2AADLyXjNz0xWwsQrlR4uwBRMVoK7uV0b1fLvoTaTEACAQKIMIGTk5YDsltlBBBDizl/NgGTzxsFmKkAC9O7NhRh6AegcxlTa2w9JdvPGMTzDMLIAt2B1iwmfiVMw7EEw8vTet2qpOcIOSMPqVjJaAnrb/iDSnYdZVqQaA6iMTW6fl/Y6JqsBVJhARbfI7SJ0cgKBiqykndde2QA6aVlJO8/d6nXbcTEX068N27mDQJ0BQClZd5o5QoZDtdx0tPc4+yXZ+/jF93ErYF2QILN78PwzYKuIGq3TVYGUJk0ukFKjdbraF2M3/tOiFABy+3NlVkgAdDkJclZIDPYGPDhtp+A/Fr6NuhkOgZSEb6ODPcGDAoDOTlw1zxZIkBmXnASZq+bZwkNdEfA/N6eDmFR7/gdDEBWzU3/XOAAAAABJRU5ErkJggg=="
class="relative w-8 h-8"
/>
<div
class="relative w-20 flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative text-left text-xl font-['SourceHanSansCN'] font-normal text-gray-900 leading-7"
>
用户登录
</div>
</div>
</div>
</div>
</div>
<div
class="relative w-[15.8125rem] flex flex-col gap-2.5 pt-[1.5499992370605469rem] pr-[1.5125007629394531rem] pb-[1.462503433227539rem] pl-[1.5499992370605469rem] justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-2xl"
>
<div
class="relative self-stretch flex flex-col gap-4 justify-start items-start h-fit w-fit"
>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[12.749999809265137rem] flex gap-2.5 pt-2 pr-[0.8000000000000007rem] pb-[0.5249999999999999rem] pl-3 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[11.2rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入账号
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[12.749999809265137rem] flex gap-2.5 pt-2 pr-[0.8000000000000007rem] pb-[0.5249999999999999rem] pl-3 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[11.2rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入密码
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.725002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-start w-fit h-fit"
>
<div
class="relative w-[3.25rem] flex gap-2.5 py-1.5 px-3 justify-center items-start h-fit bg-blue-500 rounded-md"
>
<div
class="relative text-center text-sm font-['SourceHanSansCN'] font-normal text-white leading-5"
>
登录
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.600002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 h-5 flex gap-2.5 justify-center items-start w-fit"
></div>
</div>
<div
class="relative self-stretch flex gap-2.5 pl-[4.600002288818359rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-start w-fit h-fit"
>
<div
class="relative w-14 h-5 flex gap-2.5 justify-start items-start"
></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="relative self-stretch overflow-hidden flex flex-col gap-[3.75rem] p-20 justify-start items-center h-fit w-fit"
>
<div
class="relative self-stretch flex flex-col gap-8 justify-start items-start h-fit w-fit"
>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQAAAAABCAYAAACBgAP1AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAAiSURBVFiF7cFBEQAABAAw+ifz8NOHHm5bVs8GAAAAAPDSAVqMA2uFxRa7AAAAAElFTkSuQmCC"
class="relative self-stretch h-[0.0625rem]"
/>
<div
class="relative self-stretch flex gap-16 justify-between items-start w-fit h-fit"
>
<div
class="relative text-left text-sm font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-5"
>
©2023 产品版权所有。保留所有权利。
</div>
<div
class="relative w-[21.5625rem] h-5 flex gap-6 justify-end items-start"
></div>
</div>
</div>
</div>
</div>
</body>
</html>

@ -0,0 +1,179 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="description" content="DIY可视化提供技术支持" />
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body>
<div
class="relative w-[90rem] overflow-hidden flex flex-col gap-2.5 pt-8 justify-start items-start h-fit bg-white"
>
<div
class="relative self-stretch h-[4.5rem] overflow-hidden flex flex-col px-20 justify-center items-center w-fit"
>
<div
class="relative self-stretch flex gap-8 justify-between items-center w-fit h-fit"
>
<div
class="relative flex gap-[3.75rem] justify-start items-center w-fit h-fit"
>
<div class="relative w-24 h-10 rounded-md">
<div
class="absolute left-[0.1875rem] top-[0.1875rem] text-left text-[1.3749999999999991rem] font-['Kalam'] font-bold text-[#1d2129]"
>
CAUC
</div>
</div>
<div
class="relative flex gap-8 justify-start items-start w-fit h-fit"
>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
用户登录
</div>
</div>
<div
class="relative overflow-hidden flex gap-2.5 py-1 justify-center items-center w-fit h-fit"
>
<div
class="relative text-left text-base font-['HarmonyOSSansSC'] font-normal text-[#1d2129] leading-6"
>
管理员登录
</div>
</div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
<div
class="relative w-16 h-8 overflow-hidden bg-white opacity-[0]"
></div>
</div>
</div>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAACgSURBVFiF7dZBDoIwEAXQPz0HEmWFnqKeTDiZPYWwAgOeo3XBlthRSiDmv/Vk/qRJpwWIiIj+mmgL8+JShRBuyYJF6qF7VNE6bcPD6RwWTTRj7JtovtE2E5F62Tjr9iNai/oWA9OqSRHqvXcA8Hq2Llb7zZq5A7C/DjXDjX1zjRWp18xW1CeYHUsLAMYYmyJY84oQ7QG/W5/wu0VERLR/byYuKx4pTRcbAAAAAElFTkSuQmCC"
class="relative w-10 h-10"
/>
</div>
</div>
<div
class="relative w-[90rem] flex gap-2.5 px-20 justify-start items-start h-fit"
>
<div
class="relative flex-1 flex gap-2.5 py-10 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 px-[26rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-center items-start w-fit h-fit"
>
<div
class="relative w-[28rem] flex gap-2.5 justify-start items-start h-fit"
>
<div
class="relative flex-1 flex flex-col gap-[1.5625rem] pt-8 px-10 justify-start items-start h-fit w-fit bg-white rounded-md"
>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative text-left text-2xl font-['SourceHanSansCN'] font-normal text-gray-900 leading-8"
>
管理员登录
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[23rem] flex gap-2.5 pt-2 px-4 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[21rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入账号
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative flex-1 flex gap-2.5 justify-start items-start w-fit h-fit"
>
<div
class="relative w-[23rem] flex gap-2.5 pt-2 px-4 justify-start items-start h-fit bg-white border-[0.8px] border-gray-300 rounded-md"
>
<div
class="relative w-[21rem] h-[1.6rem] text-left text-base font-['SourceHanSansCN'] font-normal text-[#9aa3b0] leading-6"
>
请输入密码
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 justify-between items-center w-fit h-fit"
>
<div
class="relative flex-1 flex gap-[16.5rem] justify-between items-center w-fit h-fit"
>
<div
class="relative w-[3.75rem] flex gap-2.5 py-2 px-4 justify-center items-start h-fit bg-blue-500 rounded-md"
>
<div
class="relative text-center text-sm font-['SourceHanSansCN'] font-normal text-white leading-5"
>
登录
</div>
</div>
<div
class="relative w-11 flex gap-2.5 py-1 px-2 justify-center items-start h-fit bg-gray-100 rounded-md"
>
<div
class="relative text-center text-sm font-['SourceHanSansCN'] font-normal text-slate-600 leading-5"
>
刷新
</div>
</div>
</div>
</div>
<div
class="relative self-stretch flex gap-2.5 pt-[0.1999988555908203rem] px-[8.4375rem] justify-center items-start w-fit h-fit"
>
<div
class="relative flex-1 h-5 flex gap-2.5 justify-center items-start w-fit"
></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div
class="relative self-stretch overflow-hidden flex flex-col gap-[3.75rem] p-20 justify-start items-center h-fit w-fit"
>
<div
class="relative self-stretch h-16 flex gap-[6.25rem] justify-start items-start w-fit"
></div>
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABQAAAAABCAYAAACBgAP1AAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAAiSURBVFiF7cFBEQAABAAw+ifz8NOHHm5bVs8GAAAAAPDSAVqMA2uFxRa7AAAAAElFTkSuQmCC"
class="relative self-stretch h-[0.0625rem]"
/>
</div>
</div>
</body>
</html>
Loading…
Cancel
Save