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,8 @@
body ,ul ,li ,h1 ,h2 ,h3 ,h4 ,h5 ,h6 ,p{
margin: 0;
padding: 0;
list-style: none;
}
a{
text-decoration: none;
}

View File

@@ -0,0 +1,121 @@
.content{
font-size: 0;
box-sizing: border-box;
padding-top: 1.39rem;
background-color: #f4f0f1;
height: calc(100vh - 1.76rem);
overflow-y: scroll;
}
.login{
display: flex;
padding: 0.41rem 0.6rem 0 0.45rem;
box-sizing: border-box;
align-items: center;
}
.login img{
width: 1.59rem;
height: 1.59rem;
margin-right: 0.33rem;
margin-bottom: 0.15rem;
}
.login_text{
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
}
.login_text li:first-child{
font-size: 0.37rem;
letter-spacing: 0.015rem;
color: #010101;
}
.login_text .login_title{
font-size: 0.37rem;
letter-spacing: 0.015rem;
color: #939393;
margin-bottom: 0.25rem;
}
.peoples{
display: flex;
position: relative;
}
.peoples p:first-child{
margin-right: 0.79rem;
}
.peoples p:first-child::after{
content: "";
width: 0.02rem;
height: 0.38rem;
background-color: #939393;
position: absolute;
top: 0.03rem;
left: calc(0.37rem*4 + 0.5rem);
}
.login_text li:last-child img{
width: 0.22rem;
height: 0.35rem;
}
.card{
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
padding-top: 0.5rem;
box-sizing: border-box;
padding-bottom: 0.45rem;
}
.card .bank img{
width: 0.52rem;
height: 0.35rem;
margin-bottom: 0.35rem;
}
.card .bank {
text-align: center;
font-size: 0.37rem;
letter-spacing: 0.015rem;
color: #939393;
position: relative;
}
.card li:first-child::after , .card li:nth-child(2)::after{
content: "";
width: 0.02rem;
height: 0.69rem;
background-color: #5e5e5e;
position: absolute;
top: 0.15rem;
right: -1.38rem;
}
.con_list li{
width: 100%;
height: 1.49rem;
display: flex;
align-items: center;
justify-content: space-between;
background: #f6f7f8;
border-bottom: 0.02rem solid #f1f1f1;
padding-left: 0.6rem;
padding-right:0.5rem;
box-sizing: border-box;
}
.list_l,.list_r{
display: flex;
align-items: center;
}
.list_l p{
margin-left: 0.6rem;
font-size: 0.4rem;
color: #020202;
}
.list_l img{
width: 0.56rem;
height: 0.49rem;
}
.list_r p{
margin-right: 0.16rem;
font-size: 0.36rem;
color: #020202;
}
.list_r img{
width: 0.22rem;
height: 0.35rem;
}

View File

@@ -0,0 +1,152 @@
.active{
border-right: none !important;
color:#ff5400 !important;
}
.active::before{
content: "";
width: 0.13rem;
height: 100%;
background-color: #ed1755;
position: absolute;
left: 0;
bottom: 0;
}
.pading_rigth{
padding-right: 0.32rem;
box-sizing: border-box;
}
.content{
padding-top: 1.39rem;
box-sizing: border-box;
height: calc(100vh - 1.49rem);
font-size: 0;
}
.con_list{
display: flex;
justify-content: space-between;
height: 100%;
}
.con_list_l{
height: 100%;
overflow-y: scroll;
}
.con_list_l li{
font-weight: 500;
font-size: 0.393rem;
color: #2a2a2a;
border-bottom: 0.03rem solid #dddddd;
border-right: 0.03rem solid #dddddd;
padding: 0.47rem 0.64rem 0.45rem 0.76rem;
position: relative;
}
.con_list_r{
flex: 1;
display: flex;
padding-left: 0.3rem;
box-sizing: border-box;
flex-direction: column;
overflow-y: scroll;
height: 100%;
margin-bottom: 1.49rem;
}
.con_list_r li{
width: 100%;
height: 2.66rem;
display: flex;
justify-content: space-between;
margin-top: 0.38rem;
}
.con_list_r li img{
width: 2.47rem;
height: 1.97rem;
}
.list_r_text{
flex: 1;
padding-left: 0.46rem;
box-sizing: border-box;
}
.list_r_text p{
font-size: 0.426rem;
color: #333333;
}
.list_r_text .sales p:first-child{
font-size: 0.295rem;
color: #333333;
}
.list_r_text .sales{
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 0.28rem;
margin-bottom: 0.23rem;
}
.list_r_text .sales p:last-child{
font-size: 0.295rem;
color: #999999;
}
.list_r_text .sales p span{
font-size: 0.491rem;
color: #ff5400;
}
.list_r_text .addless{
display: flex;
justify-content: flex-end;
}
.list_r_text .addless p{
font-size: 0.491rem;
margin: 0 0.31rem;
color: #333333;
}
.list_r_text .addless img{
width: 0.66rem;
height: 0.66rem;
}
.shoping{
width: 100%;
height: 1.49rem;
position: fixed;
left: 0;
bottom: 0;
border-top: 0.03rem solid #ddd;
background: #fff;
z-index: 999;
display: flex;
align-items: center;
justify-content: space-between;
}
.shoping .shop_l{
display: flex;
justify-content: flex-start;
align-items: center;
flex: 1;
}
.shoping .shop_l img{
width: 0.77rem;
height: 0.73rem;
margin-left:0.46rem ;
margin-right: 0.36rem;
}
.car_n{
margin-left: -0.4rem;
}
.shoping .shop_l p{
font-size: 0.36rem;
color: #666666;
margin-left: 0.81rem;
}
.shoping .shop_l p span{
font-size: 0.491rem;
color: #ff5400;
}
.shop_r{
width: 3.15rem;
height: 1.49rem;
background-color: #ed1755;
font-size: 0.491rem;
color: #ffffff;
text-align: center;
line-height: 1.49rem;
}

View File

@@ -0,0 +1,87 @@
body{
background: #f6f7f8;
}
.content{
margin-top: 1.39rem;
font-size: 0;
}
.user_p{
width: 2.03rem;
height: 2.03rem;
border-radius: 100%;
border: 0.16rem solid #ed175480;
margin-left: calc(50vw - 2.4rem/2);
margin-top: 0.36rem;
}
.btn{
width: 100%;
height: 1.31rem;
background-color: #ec1455;
text-align: center;
line-height: 1.31rem;
font-size: 0.491rem;
color: #ffffff;
position: fixed;
bottom: 0;
left: 0;
}
.input{
width: 100%;
padding: 0 0.22rem;
box-sizing: border-box;
margin-top: 0.56rem;
}
.input li{
margin-top: 0.35rem;
}
.input_ctive{
background-color: #ed1755 !important;
color: #ffffff !important;
}
.input_one_t , .input_one_b {
font-size: 0.393rem;
color: #333333;
display: flex;
justify-content: space-between;
align-items: center;
}
.input_one_t , .input_one_b {
height: 1.32rem;
width: 100%;
background: #ffffff;
border-bottom: 0.01rem solid #f6f7f8;
padding-left: 0.35rem;
padding-right: 0.31rem;
box-sizing: border-box;
}
.sex , .cale{
width: 2.07rem;
height: 0.73rem;
border-radius: 0.04rem;
border: solid 0.02rem #ed1755;
line-height: 0.73rem;
font-size: 0.36rem;
color: #ed1755;
}
.sex span, .cale span{
display: inline-block;
width: calc(100% / 2);
text-align: center;
}
.name,.birthday ,.tel,.input_yzm{
display: flex;
justify-content: space-between;
}
.tel,.input_yzm{
font-size: 0.393rem;
color: #999999;
}
.yzm{
font-size: 0.426rem;
color: #ed1755;
}
.input_one_t img, .input_one_b img{
width: 0.5rem;
height: 0.5rem;
margin-right: 0.27rem;
}

View File

@@ -0,0 +1,74 @@
body{
background: #f6f7f8;
}
.content{
font-size: 0;
margin: 1.56rem 0.25rem 0 0.43rem;
padding: 0.75rem 1.42rem 1.47rem 0.83rem;
box-sizing: border-box;
background-color: #ffffff;
height: calc(100vh - 3.48rem);
display: flex;
}
.cont_c{
flex: 1;
}
.b_title{
font-size: 0.678rem;
font-weight: bold;
letter-spacing: 0.027rem;
color: #000000;
margin-bottom: 0.78rem;
}
.spec{
margin-top: 0.49rem;
}
.spec span{
font-size: 0.38rem;
font-weight: bold;
letter-spacing: 0.015rem;
color: #000000;
margin-bottom: 0.4rem;
display: inline-block;
}
.one{
position: relative;
text-align: center;
}
.teacher{
text-align: center;
display: flex;
justify-content: space-around ;
}
.teacher img{
width: 0.59rem;
height: 0.59rem;
border-radius: 100%;
border: solid 0.02rem #fffffe;
position: absolute;
top: 0;
left: 1.2rem;
display: none;
}
.xuanzhon img{
display: block !important;
}
.t_name{
font-size: 0.3rem;
font-weight: bold;
letter-spacing: 0.012rem;
color: #000000;
}
.peoples{
font-size: 0.27rem;
font-weight: bold;
color: #696464;
transform: scale(0.8);
}
.tx{
width: 1.5rem;
height: 1.5rem;
background-color: #f1ece8;
border-radius: 100%;
margin-left: 0.23rem;
}

View File

@@ -0,0 +1,55 @@
.content{
width: 100%;
padding: 0 ;
font-size: 0;
display: flex;
justify-content: space-around;
align-items: center;
text-align: center;
position: relative;
}
.content li{
text-align: center;
}
.content li img{
width: 0.65rem;
height: 0.65rem;
}
.one{
font-size: 0.38rem;
letter-spacing: 0.015rem;
color: #6c6c6a;
}
.two{
font-size: 0.24rem;
letter-spacing: 0.01rem;
color: #6c6c6a;
}
.line{
width: 100%;
position: absolute;
font-size: 0;
top: 0.8rem;
z-index: -999;
}
.line_one{
width: 100%;
height: 0.02rem;
background-color: #f6c7bc;
}
.line_two{
width: 55%;
height: 0.02rem;
background-color: #ed1755;
position: relative;
}
.line_two span{
height: 0.06rem;
width: 0.06rem;
display: inline-block;
position: absolute;
right: 0;
top: -0.022rem;
background-color: #ed1755;
border-radius: 100%;
}

View File

@@ -0,0 +1,89 @@
.number::after{
content: "2";
width: 0.37rem;
height: 0.37rem;
background-color: #ff5400;
border-radius: 100%;
font-size: 0.229rem;
color: #ffffff;
position: absolute;
top: 0.1818rem;
text-align: center;
line-height: 0.37rem;
}
.line{
border-bottom: 0.03rem solid #eeeeee;
}
.header{
height: 1.39rem;
width: 100vw;
position: fixed;
top: 0;
left: 0;
font-size: 0;
z-index: 999;
background: url('../img/backround_img.png');
background-size: cover;
}
.header img{
height: 1.39rem;
width: 100%;
}
.header_bon{
display: flex;
justify-content: space-between;
align-items: center;
position: absolute;
bottom: 0.28rem;
width: 100%;
}
.header_bon li:first-child img{
width: 0.34rem;
height: 0.34rem;
margin-left: 0.29rem;
}
.header_bon li:nth-child(2){
font-size: 0.4rem;
letter-spacing: 0.016rem;
color: #ffffff;
font-weight: bold;
}
.header_bon li:last-child img{
width: 0.32rem;
height: 0.32rem;
/* box-shadow: 0rem 0.01rem 0.03rem 0rem
rgba(0, 0, 0, 0.3),
inset 0.005rem 0.009rem 0rem 0rem
#ffffff; */
margin-right: 0.19rem;
}
.footer{
height: 1.76rem;
width: 100%;
display: flex;
justify-content: space-around;
align-items: center;
font-size: 0;
position: fixed;
bottom: 0;
left: 0;
z-index: 999;
background: #fff;
border-bottom: ;
}
.footer_active{
color: #fe4a37 !important;
}
.footer li img{
width: 0.48rem;
height: 0.49rem;
}
.footer li{
text-align: center;
font-size: 0.366rem;
letter-spacing: 0.022rem;
color: #969696;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1,11 @@
window.onload = function () {
getRem(1125, 100)
};
window.onresize = function () {
getRem(1125, 100)
};
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";
}

View File

@@ -0,0 +1,173 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/page_2.css">
<script src="../js/index.js"></script>
<title>page2</title>
</head>
<body>
<div class="header">
<ul class="header_bon">
<li>
<img src="../img/back_bon.png" alt="">
</li>
<li>
个人中心
</li>
<li>
<img src="../img/home_bon.png" alt="">
</li>
</ul>
</div>
<div class="content">
<div class="login">
<img src="../img/touxiang.png" alt="">
<ul class="login_text">
<li>
<p class="login_title">点击登录 享受更多特权</p>
<div class="peoples">
<p>关注 0 人</p>
<p>粉丝 0 人</p>
</div>
</li>
<li>
<img src="../img/jiantou.png" alt="">
</li>
</ul>
</div>
<ul class="card">
<li class="bank">
<img src="../img/yinhangka.png" alt="">
<p>银行卡</p>
</li>
<li class="bank">
<img src="../img/yinhangka.png" alt="">
<p>银行卡</p>
</li>
<li class="bank">
<img src="../img/yinhangka.png" alt="">
<p>银行卡</p>
</li>
</ul>
<ul class="con_list">
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
<li>
<div class="list_l">
<img src="../img/tishi.png" alt="">
<p>我的收藏</p>
</div>
<div class="list_r">
<p>我的收藏</p>
<img src="../img/jiantou.png" alt="">
</div>
</li>
</ul>
</div>
<ul class="footer">
<li>
<img src="../img/shoiuchang.png" alt="">
<p>收藏</p>
</li>
<li>
<img src="../img/youhui.png" alt="">
<p>优惠</p>
</li>
<li>
<img src="../img/xinxi.png" alt="">
<p>信息</p>
</li>
<li>
<img src="../img/kecheng.png" alt="">
<p>课程</p>
</li>
<li class="footer_active">
<img src="../img/wode.png" alt="">
<p>我的</p>
</li>
</ul>
</body>
</html>

View File

@@ -0,0 +1,171 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/page_3.css">
<script src="../js/index.js"></script>
<title>page3</title>
<!-- 左右进度条有bug -->
</head>
<body>
<div class="header">
<ul class="header_bon">
<li>
<img src="../img/back_bon.png" alt="">
</li>
<li>
全部课程
</li>
<li>
<img src="../img/home_bon.png" alt="">
</li>
</ul>
</div>
<div class="content">
<div class="con_list">
<ul class="con_list_l">
<li class="active number">已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li class="number">已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li class="number">已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li>已选课程</li>
<li class="number">已选课程</li>
<li>已选课程</li>
</ul>
<ul class="con_list_r">
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
<li class="line pading_rigth">
<img src="../img/list_img.png" alt="">
<div class="list_r_text">
<p>名师书法</p>
<div class="sales">
<p>¥<span>2500</span> 元</p>
<p>销量:150份</p>
</div>
<div class="addless">
<img src="../img/jianshao.png" alt="">
<p>2</p>
<img src="../img/zhengjia.png" alt="">
</div>
</div>
</li>
</ul>
</div>
<div class="shoping">
<div class="shop_l">
<img src="../img/gouwuche.png" alt="" >
<div class="number car_n"></div>
<p>共计:<span>5500</span> 元</p>
</div>
<div class="shop_r">
选好了
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,75 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/page_6.css">
<script src="../js/index.js"></script>
<title>page6</title>
</head>
<body>
<div class="header">
<ul class="header_bon">
<li>
<img src="../img/back_bon.png" alt="">
</li>
<li>
注册认证
</li>
<li>
<img src="../img/home_bon.png" alt="">
</li>
</ul>
</div>
<div class="content">
<img src="../img/touxiang.png" alt="" class="user_p">
<ul class="input">
<li>
<div class="input_one_t">
<div class="name">
<img src="../img/yonhu.png" alt="">
<p>喵喵喵</p>
</div>
<div class="sex">
<span class="input_ctive">男</span><span>女</span>
</div>
</div>
<div class="input_one_b">
<div class="birthday">
<img src="../img/yonhu.png" alt="">
<p>2000-12-1</p>
</div>
<div class="cale">
<span class="input_ctive">公历</span><span>农历</span>
</div>
</div>
</li>
<li>
<div class="input_one_t">
<div class="tel">
<img src="../img/yonhu.png" alt="">
<p>请输入您的手机号(必填)</p>
</div>
<div class="yzm">
获取验证码
</div>
</div>
<div class="input_one_b">
<div class="input_yzm">
<img src="../img/yonhu.png" alt="">
<p>请输入验证码(必填)</p>
</div>
</div>
</li>
<li></li>
</ul>
<div class="btn">
认证
</div>
</div>
</html>

View File

@@ -0,0 +1,126 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/page_7.css">
<script src="../js/index.js"></script>
<title>page7</title>
</head>
<body>
<div class="header">
<ul class="header_bon">
<li>
<img src="../img/back_bon.png" alt="">
</li>
<li>
注册认证
</li>
<li>
<img src="../img/home_bon.png" alt="">
</li>
</ul>
</div>
<div class="content">
<div class="cont_c">
<p class="b_title">名师推荐</p>
<ul class="spec_c">
<li class="spec">
<span>创意美术</span>
<div class="teacher ">
<div class="one xuanzhon">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
</div>
</li>
<li class="spec">
<span>创意美术</span>
<div class="teacher ">
<div class="one xuanzhon">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one xuanzhon">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one ">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
</div>
</li>
<li class="spec">
<span>创意美术</span>
<div class="teacher ">
<div class="one xuanzhon">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
<div class="one xuanzhon">
<div class="tx"></div>
<p class="t_name">老师甲</p>
<p class="peoples">粉丝:9920</p>
<img src="../img/true.png" alt="">
</div>
</div>
</li>
</ul>
</div>
</div>
<ul class="footer">
<li>
<img src="../img/shoiuchang.png" alt="">
<p>收藏</p>
</li>
<li>
<img src="../img/youhui.png" alt="">
<p>优惠</p>
</li>
<li>
<img src="../img/xinxi.png" alt="">
<p>信息</p>
</li>
<li>
<img src="../img/kecheng.png" alt="">
<p>课程</p>
</li>
<li class="footer_active">
<img src="../img/wode.png" alt="">
<p>我的</p>
</li>
</ul>
</body>
</html>

View File

@@ -0,0 +1,48 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/page_8.css">
<script src="../js/index.js"></script>
<title>page8</title>
</head>
<body>
<ul class="content">
<li>
<p class="one">普通</p>
<img src="../img/paizi.png" alt="">
<p class="two">1000</p>
</li>
<li>
<p class="one">普通</p>
<img src="../img/paizi.png" alt="">
<p class="two">1000</p>
</li>
<li>
<p class="one">普通</p>
<img src="../img/paizi.png" alt="">
<p class="two">1000</p>
</li>
<li>
<p class="one">普通</p>
<img src="../img/paizi.png" alt="">
<p class="two">1000</p>
</li>
<li>
<p class="one">普通</p>
<img src="../img/paizi.png" alt="">
<p class="two">1000</p>
</li>
</ul>
<div class="line">
<div class="line_one">
<div class="line_two">
<span>.</span>
</div>
</div>
</div>
</body>
</html>