上传文件至 demo
This commit is contained in:
commit
803292ff5f
70
demo/demo.html
Normal file
70
demo/demo.html
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Document</title>
|
||||
<link rel="stylesheet" type="text/css" href="./common.css" />
|
||||
<link rel="stylesheet" type="text/css" href="./index.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div class="page flex-col">
|
||||
<div class="group_1 flex-col">
|
||||
<div class="group_2 flex-col">
|
||||
<div class="box_1 flex-col">
|
||||
<div class="group_3 flex-col">
|
||||
<div class="image-wrapper_2 flex-row">
|
||||
<img
|
||||
class="image_1"
|
||||
referrerpolicy="no-referrer"
|
||||
src="https://lanhu-oss.lanhuapp.com/SketchPnge96a25a97a68c514590ea4d22ed63175a8eeae1cd856d2b2b695313fb63fd2be"
|
||||
/>
|
||||
</div>
|
||||
<div class="group_5 flex-row">
|
||||
<div class="text-wrapper_1">
|
||||
<span class="text_1">MRGC-EDU</span>
|
||||
<span class="paragraph_1"><br /></span>
|
||||
<span class="text_2">教学实训云平台</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group_6 flex-row">
|
||||
<div class="image-text_3 flex-row justify-between">
|
||||
<img
|
||||
class="thumbnail_1"
|
||||
referrerpolicy="no-referrer"
|
||||
src="https://lanhu-oss.lanhuapp.com/SketchPng4fa66394ec5336bf467e995fdd91cb3f06b47c841b825b6cc08bd2a167a29cef"
|
||||
/>
|
||||
<span class="text-group_1">输入你的用户名</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group_7 flex-row">
|
||||
<div class="section_1 flex-col"></div>
|
||||
</div>
|
||||
<div class="group_8 flex-row">
|
||||
<div class="image-text_4 flex-row justify-between">
|
||||
<img
|
||||
class="thumbnail_2"
|
||||
referrerpolicy="no-referrer"
|
||||
src="https://lanhu-oss.lanhuapp.com/SketchPng287f44a89cb527edd4f3d8d1a8c81d43da2ed6dd09b9ef7f0004a8c18bdf010a"
|
||||
/>
|
||||
<span class="text-group_2">输入你的密码</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group_9 flex-row">
|
||||
<div class="group_4 flex-col"></div>
|
||||
</div>
|
||||
<div class="text-wrapper_4 flex-row">
|
||||
<span class="text_3">忘记密码</span>
|
||||
</div>
|
||||
<div class="group_10 flex-row">
|
||||
<div class="text-wrapper_3 flex-col">
|
||||
<span class="text_4">登 录</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
232
demo/index.css
Normal file
232
demo/index.css
Normal file
|
|
@ -0,0 +1,232 @@
|
|||
.page {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
position: relative;
|
||||
width: 1920px;
|
||||
height: 1080px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.group_1 {
|
||||
height: 1080px;
|
||||
background: url(https://lanhu-oss.lanhuapp.com/SketchPng0e96af0d0232c5137e797f36a507c5d7f5942dbd7ef51a7fd509aa92e5235924) 100% no-repeat;
|
||||
background-size: 100% 100%;
|
||||
margin-left: 1088px;
|
||||
width: 832px;
|
||||
}
|
||||
|
||||
.group_2 {
|
||||
background-color: rgba(31, 120, 212, 1);
|
||||
height: 1080px;
|
||||
margin-left: -1088px;
|
||||
grid-template-columns: repeat(0, 1fr);
|
||||
width: 1920px;
|
||||
}
|
||||
|
||||
.box_1 {
|
||||
background-image: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/7bbf00aeec1e4fafb9470ae6ed13a070_mergeImage.png);
|
||||
height: 1080px;
|
||||
width: 1920px;
|
||||
}
|
||||
.group_3 {
|
||||
height: 599px;
|
||||
background: url(https://lanhu-dds-backend.oss-cn-beijing.aliyuncs.com/merge_image/imgs/e020f4f2b53248e19e2ad78d9a45110f_mergeImage.png) 100% no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 952px;
|
||||
margin: 240px 0 0 484px;
|
||||
}
|
||||
|
||||
.image-wrapper_2 {
|
||||
width: 153px;
|
||||
height: 41px;
|
||||
margin: 35px 0 0 35px;
|
||||
}
|
||||
|
||||
.image_1 {
|
||||
width: 153px;
|
||||
height: 41px;
|
||||
}
|
||||
|
||||
.group_5 {
|
||||
width: 209px;
|
||||
height: 90px;
|
||||
margin: 4px 0 0 610px;
|
||||
}
|
||||
|
||||
.text-wrapper_1 {
|
||||
width: 209px;
|
||||
height: 90px;
|
||||
overflow-wrap: break-word;
|
||||
font-size: 0;
|
||||
font-family: PingFangSC-Semibold;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.text_1 {
|
||||
width: 209px;
|
||||
height: 90px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.86);
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Semibold;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.paragraph_1 {
|
||||
width: 209px;
|
||||
height: 90px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(196, 196, 196, 0.86);
|
||||
font-size: 42px;
|
||||
font-family: PingFangSC-Semibold;
|
||||
font-weight: 600;
|
||||
text-align: left;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.text_2 {
|
||||
width: 209px;
|
||||
height: 90px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.46);
|
||||
font-size: 28px;
|
||||
font-family: PingFangSC-Medium;
|
||||
font-weight: 500;
|
||||
text-align: left;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.group_6 {
|
||||
width: 159px;
|
||||
height: 25px;
|
||||
margin: 69px 0 0 538px;
|
||||
}
|
||||
|
||||
.image-text_3 {
|
||||
width: 159px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.thumbnail_1 {
|
||||
width: 17px;
|
||||
height: 18px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.text-group_1 {
|
||||
width: 126px;
|
||||
height: 25px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.86);
|
||||
font-size: 18px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.group_7 {
|
||||
width: 356px;
|
||||
height: 2px;
|
||||
margin: 10px 0 0 536px;
|
||||
}
|
||||
|
||||
.section_1 {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
width: 356px;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
.group_8 {
|
||||
width: 140px;
|
||||
height: 25px;
|
||||
margin: 54px 0 0 539px;
|
||||
}
|
||||
|
||||
.image-text_4 {
|
||||
width: 140px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
.thumbnail_2 {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.text-group_2 {
|
||||
width: 108px;
|
||||
height: 25px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.86);
|
||||
font-size: 18px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.group_9 {
|
||||
width: 356px;
|
||||
height: 2px;
|
||||
margin: 10px 0 0 536px;
|
||||
}
|
||||
|
||||
.group_4 {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
border-radius: 8px;
|
||||
width: 356px;
|
||||
height: 2px;
|
||||
}
|
||||
|
||||
.text-wrapper_4 {
|
||||
width: 72px;
|
||||
height: 25px;
|
||||
margin: 14px 0 0 820px;
|
||||
}
|
||||
|
||||
.text_3 {
|
||||
width: 72px;
|
||||
height: 25px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(0, 0, 0, 0.86);
|
||||
font-size: 18px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
line-height: 25px;
|
||||
}
|
||||
|
||||
.group_10 {
|
||||
width: 355px;
|
||||
height: 80px;
|
||||
margin: 46px 0 67px 536px;
|
||||
}
|
||||
|
||||
.text-wrapper_3 {
|
||||
background-color: rgba(0, 91, 247, 1);
|
||||
border-radius: 8px;
|
||||
height: 80px;
|
||||
width: 355px;
|
||||
}
|
||||
|
||||
.text_4 {
|
||||
width: 84px;
|
||||
height: 50px;
|
||||
overflow-wrap: break-word;
|
||||
color: rgba(255, 255, 255, 0.86);
|
||||
font-size: 36px;
|
||||
font-family: PingFangSC-Regular;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
line-height: 50px;
|
||||
margin: 15px 0 0 141px;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user