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,18 @@
body,ul,p,h1,h2,h3,h4,h5,h6,a {
margin: 0;
padding: 0;
list-style: none;
text-decoration: none;
}
body {
background: #f3f4f7;
}
html {
/* font-size: 50px; */
line-height: 1;
}
body {
font-size: 0;
}

View File

@@ -0,0 +1,263 @@
.header{
display: flex;
justify-content: space-between;
align-items: center;
height: 0.9rem;
width: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 9999;
box-sizing: border-box;
padding: 0 0.43rem;
}
.header .header_div{
display: flex;
align-items: center;
}
.header .header_div .header_div_zi{
font-family: AdobeHeitiStd-Regular;
font-size: 0.36rem;
color: #ffffff;
margin-right: 0.3rem;
}
.header .header_div .qq{
position: relative;
}
.header .header_div .qq::after{
content: "";
width: 0.4rem;
height: 0.04rem;
background-color: #ffffff;
border-radius: 0.02rem;
position: absolute;
bottom: -0.1rem;
left: 50%;
transform: translateX(-50%);
}
.header .header_div .header_div_zi1{
font-family: AdobeHeitiStd-Regular;
font-size: 0.36rem;
color: #ffffff;
}
.header .header_img{
width: 0.56rem;
height: 0.43rem;
}
/*******************************************/
.content{
margin-bottom: 1.3rem;
}
.content .content_tu {
width: 7.5rem;
height: 5.5rem;
}
/***************************************/
.content_div{
display: flex;
padding: 0.42rem 0.43rem 0 0.24rem;
}
.content_div .shop{
width: 0.86rem;
height: 0.86rem;
position: relative;
}
.content_div .shop .shop_img{
width: 0.86rem;
height: 0.86rem;
}
.content_div .shop .shop_div{
width: 0.27rem;
height: 0.29rem;
background-color: #ea4e3d;
border-radius: 0.05rem;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
bottom: -0.08rem;
right: 0;
}
.content_div .shop .shop_div .shop_div_img{
width: 0.19rem;
height: 0.17rem;
}
/***************************/
.show{
margin-left: 0.23rem;
flex: 1;
}
.show .show_div{}
.show .show_div .Skin{
display: flex;
align-items: center;
justify-content: space-between;
}
.show .show_div .Skin .Skin_zi{
font-family: PingFang-SC-Bold;
font-size: 0.3rem;
color: #5a6f92;
}
.show .show_div .Skin .Skin_zi2{
font-family: PingFangSC-Regular;
font-size: 0.24rem;
color: #999999;
}
.show .show_div .writing {
font-family: PingFangSC-Regular;
font-size: 0.24rem;
color: #686868;
line-height: 0.36rem;
margin-top: 0.23rem;
}
/***********************/
.Exhibits{
display: flex;
align-items: center;
margin-top: 0.25rem;
}
.Exhibits .Exhibits_li{
position: relative;
}
.Exhibits .Exhibits_li:nth-child(2){
margin: 0 0.11rem;
}
.Exhibits .Exhibits_li .Exhibits_li_img{
width: 1.85rem;
height: 1.85rem;
}
.Exhibits .Exhibits_li .Exhibits_li_zi{
font-family: PingFang-SC-Medium;
font-size: 0.24rem;
font-weight: normal;
font-stretch: normal;
line-height: 0.36rem;
letter-spacing: 0rem;
color: #ffffff;
position: absolute;
bottom: 0.11rem;
right: 0.09rem;
}
/********************************************/
.minute{
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 0.27rem;
}
.minute .minute_div{
font-family: PingFangSC-Regular;
font-size: 0.2rem;
font-weight: normal;
font-stretch: normal;
letter-spacing: 0rem;
color: #989898;
}
.minute .minute_div span{
font-family: PingFangSC-Regular;
font-size: 0.24rem;
color: #989898;
}
.minute .minute_div1{
width: 0.39rem;
height: 0.27rem;
background-color: #f1f1f1;
display: flex;
justify-content: center;
align-items: center;
margin-right: 0.19rem;
}
.minute .minute_div1 .minute_div1_t{
width: 0.09rem;
height: 0.07rem;
border-radius: 100%;
background-color: #585151;
}
.minute .minute_div1 .minute_div1_t:nth-child(2){
margin: 0 0.02rem;
}
body{
background-color: #ffffff;
}
/**************************************************************/
.Like{
padding: 0.28rem 0 0.2rem 0.29rem;
background-color: #f7f7f7;
border-radius: 0.1rem;
margin-right: 0.18rem;
margin-top: 0.36rem;
}
.Like .Like_div{
position: relative;
padding-bottom: 0.21rem;
}
.Like .Like_div::after{
content: "";
width: 5.58rem;
height: 0.01rem;
background-color: #dedede;
position: absolute;
left: -0.28rem;
bottom: 0;
}
.Like .Like_div .Like_div_img{
width: 0.29rem;
height: 0.26rem;
margin-right: 0.22rem;
}
.Like .Like_div .Like_div_zi{
font-family: PingFang-SC-Bold;
font-size: 0.3rem;
color: #5a6f92;
}
.comments{
}
.comments .comments_div{
display: flex;
align-items: center;
margin-top: 0.22rem;
}
.comments .comments_div div{
font-family: PingFang-SC-Bold;
font-size: 0.3rem;
color: #5a6f92;
}
.comments .comments_div .comments_div_zi{
color: #000;
}
/*********************************************************/
.footer{
display: flex;
justify-content: space-between;
align-items: center;
background-color: #000000;
height: 1rem;
width: 100%;
padding: 0 0.45rem;
position: fixed;
left: 0;
bottom: 0;
z-index: 9999;
box-sizing: border-box;
}
.footer li{
font-family: AdobeHeitiStd-Regular;
font-size: 0.24rem;
letter-spacing: 0rem;
color: #ffffff;
}
.footer .qqq{
position: relative;
}
.footer .qqq::after{
content: "";
width: 0.51rem;
height: 0.03rem;
background-color: #ffffff;
border-radius: 0.015rem;
font-size: 0.3rem;
position: absolute;
bottom: -0.32rem;
left: 50%;
transform: translateX(-50%);
}

View File

@@ -0,0 +1,25 @@
.left {
float: left;
}
.white {
background: white;
}
.right {
float: right;
}
.hidden{
overflow: hidden;
}
.xcenter {
text-align: center;
}
.relative {
position: relative;
}
.absolute {
position: absolute;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1004 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@@ -0,0 +1,165 @@
<!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>Document</title>
<script src="../1/js/rem.js"> </script>
<link rel="stylesheet" href="./css/public.css">
<link rel="stylesheet" href="./css/clear.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="header">
<div></div>
<div class="header_div">
<div class="header_div_zi ">圈子</div>
<div class="header_div_zi1 qq">附近</div>
</div>
<img src="./img/1.png" class="header_img">
</div>
<div class="content">
<img class="content_tu" src="./img/2.png">
<div class="content_div">
<div class="shop">
<img class="shop_img" src="./img/3.png">
<div class="shop_div">
<img class="shop_div_img" src="./img/4.png">
</div>
</div>
<div class="show">
<div class="show_div">
<div class="Skin">
<div class="Skin_zi">护肤品专卖店</div>
<div class="Skin_zi2">>200km</div>
</div>
<div class="writing">
我亲测好用我亲测好用我亲测好用我亲测好用我亲测好
用我亲测好用我亲测好用我亲测好用我亲测好用我亲好
用我亲测我亲测我亲测我亲测
</div>
<ul class="Exhibits">
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
</ul>
<div class="minute">
<div class="minute_div">
<span>3</span>
分钟前
</div>
<div class="minute_div1">
<div class="minute_div1_t"></div>
<div class="minute_div1_t"></div>
<div class="minute_div1_t"></div>
</div>
</div>
<div class="Like">
<div class="Like_div">
<img class="Like_div_img" src="./img/6.png">
<di class="Like_div_zi">张三 、李
</div>
<div class="comments">
<div class="comments_div">
<div>小可:</div>
<div class="comments_div_zi">精彩</div>
</div>
</div>
<div class="comments">
<div class="comments_div">
<div>小可:</div>
<div class="comments_div_zi">精彩</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="content_div">
<div class="shop">
<img class="shop_img" src="./img/3.png">
<div class="shop_div">
<img class="shop_div_img" src="./img/4.png">
</div>
</div>
<div class="show">
<div class="show_div">
<div class="Skin">
<div class="Skin_zi">护肤品专卖店</div>
<div class="Skin_zi2">>200km</div>
</div>
<div class="writing">
我亲测好用我亲测好用我亲测好用我亲测好用我亲测好
用我亲测好用我亲测好用我亲测好用我亲测好用我亲好
用我亲测我亲测我亲测我亲测
</div>
<ul class="Exhibits">
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
<li class="Exhibits_li">
<img class=" Exhibits_li_img" src="./img/5.png">
<div class="Exhibits_li_zi">¥289.00</div>
</li>
</ul>
<div class="minute">
<div class="minute_div">
<span>3</span>
分钟前
</div>
<div class="minute_div1">
<div class="minute_div1_t"></div>
<div class="minute_div1_t"></div>
<div class="minute_div1_t"></div>
</div>
</div>
<div class="Like">
<div class="Like_div">
<img class="Like_div_img" src="./img/6.png">
<di class="Like_div_zi">张三 、李
</div>
<div class="comments">
<div class="comments_div">
<div>小可:</div>
<div class="comments_div_zi">精彩</div>
</div>
</div>
<div class="comments">
<div class="comments_div">
<div>小可:</div>
<div class="comments_div_zi">精彩</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<ul class="footer">
<li>首页</li>
<li>好友</li>
<li class="qqq">圈子</li>
<li>购物车</li>
<li>我的</li>
</ul>
</body>
</html>