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,17 @@
/* 专门用来清除标签的默认样式的 */
li {
list-style: none; /* 清除li标签的小圆点 */
}
a {
text-decoration: none; /* 清除a标签的下划线 */
}
body,ul,p,h1,h2,h3,h4,h5,h6{
margin: 0;
padding: 0;
}
input {
outline: none;
}

View File

@@ -0,0 +1,124 @@
body {
background: #f3f4f7;
}
.header {
width: 100%;
height: 1.8rem;
position: fixed;
top: 0;
left: 0;
background: #fff;
padding-left: 0.25rem;
padding-top: 0.67rem;
box-sizing: border-box;
}
.header img {
width: 0.38rem;
height: 0.68rem;
}
.content {
margin-top: 1.8rem;
}
.name {
display: flex;
padding-top: 1.8rem;
padding-left: 0.48rem;
background: #fff;
}
.name_pic {
width: 2.4rem;
height: 2.4rem;
}
.name_list {
margin-left: 0.58rem;
}
.name_one {
display: flex;
align-items: baseline;
margin-bottom: 0.48rem;
}
.name_one span {
font-size: 0.72rem;
line-height: 0.72rem;
color: #000000;
margin-right: 0.2rem;
}
.name_one img {
width: 0.54rem;
height: 0.54rem;
}
.name_list ul li {
font-size: 0.52rem;
color: #868686;
margin-bottom: 0.34rem;
}
.name_mes {
margin-top: 0.34rem;
background: #fff;
padding-left: 0.46rem;
}
.mes_list_one {
font-size: 0.64rem;
color: #000000;
margin-right: 0.75rem;
}
.mes_list_two {
font-size: 0.64rem;
color: #868686;
}
.name_mes li img {
width: 0.28rem;
height: 0.48rem;
padding-right: 0.5rem;
}
.name_mes li {
display: flex;
justify-content: space-between;
align-items: center;
height: 2.18rem;
border-bottom: 0.02rem solid #dcdcdc;
}
.name_mes li:last-child {
border: none;
}
.mes_list_the {
font-size: 0.64rem;
color: #000000;
margin-right: 2rem;
}
.mes_list_four {
font-size: 0.64rem;
color: #5a6f92;
}
.name_bottom {
background: #fff;
margin-top: 0.34rem;
}
.name_bottom_one {
width: 0.72rem;
height: 0.68rem;
margin-right: 0.3rem;
}
.name_bottom_two {
width: 0.64rem;
height: 0.68rem;
margin-right: 0.3rem;
}
.name_bottom span {
font-size: 0.64rem;
color: #5a6f92;
margin-right: 0.3rem;
}
.name_bottom li {
height: 2.16rem;
display: flex;
justify-content: center;
align-items: center;
}
.name_bottom li:first-child {
border-bottom: 0.02rem solid #dcdcdc;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@@ -0,0 +1,79 @@
<!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>
<link rel="stylesheet" href="./css/clear.css">
<link rel="stylesheet" href="./css/public.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div class="header">
<img src="./img/left.png" alt="">
</div>
<div class="content">
<div class="name">
<img class="name_pic" src="./img/pic.png" alt="">
<div class="name_list">
<div class="name_one">
<span>张可</span>
<img src="./img/wm.png" alt="">
</div>
<ul>
<li>昵称:小可爱</li>
<li>ID:1234555</li>
<li>地区:安徽合肥</li>
</ul>
</div>
</div>
<ul class="name_mes">
<li>
<div class="mes_list">
<span class="mes_list_one">好友备注</span>
<span class="mes_list_two">张可</span>
</div>
<img src="./img/aa.png" alt="">
</li>
<li>
<div class="mes_list">
<span class="mes_list_the">手机</span>
<span class="mes_list_four">1300000000</span>
</div>
</li>
<li>
<div class="mes_list">
<span class="mes_list_the">生日</span>
<span class="mes_list_two">1993-12-12</span>
</div>
<img src="./img/aa.png" alt="">
</li>
<li>
<div class="mes_list">
<span class="mes_list_one">朋友圈</span>
</div>
<img src="./img/aa.png" alt="">
</li>
</ul>
<ul class="name_bottom">
<li>
<img class="name_bottom_one" src="./img/mes.png" alt="">
<span>发消息</span>
</li>
<li>
<img class="name_bottom_two" src="./img/rab.png" alt="">
<span>删除</span>
</li>
</ul>
</div>
<div class="footer"></div>
</body>
<script src="./js/rem.js"></script>
</html>

View File

@@ -0,0 +1,11 @@
window.onload = function () {
getRem(750, 50)
};
window.onresize = function () {
getRem(750, 50)
};
function getRem(pwidth, prem) {
var html = document.getElementsByTagName("html")[0];
var oWidth = document.body.clientWidth || document.documentElement.clientWidth;
html.style.fontSize = oWidth / pwidth * prem + "px";
}