first commit

This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions

View File

@@ -0,0 +1,5 @@
body,ul,li,p,h1,h2,h3,h4,h5,h6{
margin: 0;
padding: 0;
list-style: none;
}

View File

@@ -0,0 +1,139 @@
body {
background-color: #f5f5f5;
}
.footer {
display: flex;
justify-content: space-around;
align-items: center;
position: fixed;
width: 100%;
height: 50px;
bottom: 0;
left: 0;
right: 0;
background: #fff;
border-top: 1px solid #d5d2d2;
box-sizing: border-box;
}
.footer li {
text-align: center;
}
.footer li i {
display: inline-block;
margin-bottom: 3px;
}
.footer li p {
font-size: 10px;
zoom: 0.9;
color: #8e8e93;
}
.userinfo {
height: 110px;
background: linear-gradient(90deg,#0af,#0085ff);
padding: 25px 15px;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
}
.userinfo_left {
display: flex;
align-items: center;
}
.userinfo_left img{
width: 60px;
height: 60px;
border-radius: 100%;
}
.phone {
margin-left: 12px;
}
.phone .title{
font-size: 21px;
color: #fff;
font-weight: 700;
}
.phone_text {
color: #fff;
font-size: 12px;
display: flex;
align-items: center;
margin-top: 2px;
}
.userinfo .icon-zhankai {
color: #fff;
}
.activity {
display: flex;
height: 84px;
background: #fff;
}
.activity li {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 50%;
height: 100%;
}
.activity li:first-child {
border-right: 1px solid #ddd;
}
.activity p {
font-size: 12px;
color: #666;
font-weight: 700;
margin-top: 4px;
}
.activity li .text{
display: flex;
align-items: flex-end;
}
.activity .text .number{
font-size: 26px;
color: rgb(255, 95, 62);
line-height: 22px;
}
.activity .text .nums{
font-size: 12px;
color: rgb(255, 95, 62);
}
.green .number,
.green .nums{
color: rgb(106, 194, 11) !important;
}
.setting {}
.setting li {
height: 45px;
background: #fff;
margin-top: 13px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 15px;
}
.clear li {
margin-top: 0 !important;
}
.setting li .left{
display: flex;
align-items: center;
}
.setting li .left i{
font-size: 20px;
}
.setting li .left span {
font-size: 15px;
margin-left: 7px;
}
.setting li .icon-zhankai{
font-size: 13px;
color: #bbb;
}

View File

@@ -0,0 +1,102 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>饿了么</title>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2622901_kl3e9hjw79j.css">
<link rel="stylesheet" href="./css/clear.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="content">
<div class="userinfo">
<div class="userinfo_left">
<img src="https://cube.elemecdn.com/c/6b/8384f98b8dedfd87fc1450926648cjpeg.jpeg?x-oss-process=image/format,webp/resize,w_120,h_120,m_fixed" alt="">
<div class="phone">
<div class="title">bmycode</div>
<div class="phone_text">
<i class="iconfont icon-gouwuche"></i>
<span>151****5354</span>
</div>
</div>
</div>
<i class="iconfont icon-zhankai"></i>
</div>
<ul class="activity">
<li>
<div class="text">
<span class="number">4</span>
<span class="nums">个</span>
</div>
<p>红包</p>
</li>
<li>
<div class="text green">
<span class="number">902</span>
<span class="nums">个</span>
</div>
<p>金币</p>
</li>
</ul>
<ul class="setting">
<li>
<div class="left">
<i class="iconfont icon-gouwuche"></i>
<span>我的地址</span>
</div>
<i class="iconfont icon-zhankai"></i>
</li>
<li>
<div class="left">
<i class="iconfont icon-gouwuche"></i>
<span>我的地址</span>
</div>
<i class="iconfont icon-zhankai"></i>
</li>
<li>
<div class="left">
<i class="iconfont icon-gouwuche"></i>
<span>我的地址</span>
</div>
<i class="iconfont icon-zhankai"></i>
</li>
</ul>
<ul class="setting clear">
<li>
<div class="left">
<i class="iconfont icon-gouwuche"></i>
<span>我的地址</span>
</div>
<i class="iconfont icon-zhankai"></i>
</li>
<li>
<div class="left">
<i class="iconfont icon-gouwuche"></i>
<span>我的地址</span>
</div>
<i class="iconfont icon-zhankai"></i>
</li>
</ul>
</div>
<ul class="footer">
<li>
<i class="iconfont icon-ziyuan"></i>
<p>首页</p>
</li>
<li>
<i class="iconfont icon-ziyuan"></i>
<p>订单</p>
</li>
<li>
<i class="iconfont icon-ziyuan"></i>
<p>我的</p>
</li>
</ul>
</body>
</html>