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,30 @@
<!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>
<style>
.box{
width:300px;
height: 500px;
}
.box img{
width: 100%;
height: 100%;
}
.box img:hover{
transform: scale(2);
}
</style>
</head>
<body>
<div class="box">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater" alt="">
</div>
</body>
</html>

View File

@@ -0,0 +1,79 @@
.menu{
width: 100%;
height:380px;
background:url(https://v.icbc.com.cn/userfiles/adresources/783700658196332544.jpg) -243px center no-repeat;
}
.center{
width: 1000px;
height: 100%;
margin: 0 auto;
position: relative;
}
.center_left{
width: 280px;
height: 330px;
background: white;
padding: 25px 19px;
box-sizing: border-box;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.center_left .title{
width: 100%;
height: 43px;
line-height: 43px;
background: rgb(207, 21, 21);
}
.title .icon-yonghu,
.title .icon-qiye,
.title .icon-gouwuche{
font-size: 23px;
color: white;
margin-left: 10px;
}
.title .icon-zhankai1{
font-size: 16px;
color: white;
vertical-align: top;
display: inline-block;
transform: rotate(-90deg)
}
.center_left .title a{
font-size:16px;
color:white ;
vertical-align: top;
}
.list {
width: 100%;
height: 55px;
padding: 6px;
box-sizing: border-box;
}
.list li{
float: left;
margin-right:19px ;
text-align: center ;
}
.list li a{
font-size:13px;
color:grey;
}
.center_righ {
position: absolute;
bottom: 11px;
right: 12px;
}
.center_righ li{
width: 50px;
height: 5px;
background: white;
float: left;
margin-right: 10px;
}
.center_righ li:hover{
background: rgb(207, 21, 21);
}

View File

@@ -0,0 +1,77 @@
<!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">
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_3889063_wzfbr8dk2ii.css">
<link rel="stylesheet" href="../../public.css">
<link rel="stylesheet" href="../../clear.css">
<link rel="stylesheet" href="./中国工商银行.css">
<title>中国工商银行</title>
</head>
<body>
<div class="menu">
<div class="center">
<ul class="center_left">
<li>
<div class="title">
<i class=" iconfont icon-yonghu"></i>
<a href="">个人网上银行登录</a>
<i class=" iconfont icon-zhankai1"></i>
</div>
<ul class="list ">
<li><a href="">注 册</a></li>
<li><a href="">客户端下载</a></li>
<li><a href="">业务指南</a></li>
<li><a href="">安全专区</a></li>
<li><a href="">网银助手</a></li>
<li><a href="">防范假网站</a></li>
</ul>
</li>
<li>
<div class="title">
<i class=" iconfont icon-yonghu"></i>
<a href="">个人网上银行登录</a>
<i class=" iconfont icon-zhankai1"></i>
</div>
<ul class="list ">
<li><a href="">注 册</a></li>
<li><a href="">客户端下载</a></li>
<li><a href="">业务指南</a></li>
<li><a href="">安全专区</a></li>
<li><a href="">网银助手</a></li>
<li><a href="">防范假网站</a></li>
</ul>
</li>
<li>
<div class="title">
<i class=" iconfont icon-yonghu"></i>
<a href="">个人网上银行登录</a>
<i class=" iconfont icon-zhankai1"></i>
</div>
<ul class="list ">
<li><a href="">注 册</a></li>
<li><a href="">客户端下载</a></li>
<li><a href="">业务指南</a></li>
<li><a href="">安全专区</a></li>
<li><a href="">网银助手</a></li>
<li><a href="">防范假网站</a></li>
</ul>
</li>
</ul>
<ul class="center_righ">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,121 @@
.main{
width: 100%;
/* background: rgb(240, 212, 212); */
}
.center{
width: 1295.33px;
height:100% ;
margin: 0 auto;
}
.title{
}
.hot{
margin-bottom: 4px;
}
.hot a{
font-size:14px ;
font-weight: 600;
color: #fd8320;
}
.hot a img{
width: 20px;
height: 20px;
}
.title_menu {
color: #666;
font-size: 20px;
}
.title_menu span{
font-weight: 600;
}
.center_bottom{
width: 100%;
height: 592px;
padding-top: 16px;
box-sizing: border-box;
}
.center_bottom .list li{
float: left;
margin-right: 19px;
}
.center_bottom .list li:hover .list_bottom{
transition: all 4s;
display: block;
}
.center_bottom .list li:hover .list_location{
display: none;
}
.center_bottom .list li img:hover {
transform: scale(1.1,1.1);
transition: all 1.2s;
}
.list img,
.list_location{
width: 100%;
height: 518.67px;
}
.list li{
}
.list li{
position: relative;
overflow: hidden;
}
.list_location{
font-size: 12px;
font-weight: 400px;
position: absolute;
top:0;
}
.list_count,.list_copright{
position: absolute;
right: 8px;
padding: 0 8px ;
box-sizing: border-box;
}
.list_count{
width: max-content;
height:26px;
line-height: 26px;
font-weight: 400;
font-size: 14px;
color: #FFF;
background:rgba(0,0,0,.58) ;
border-radius: 4px;
top:6px;
}
.list_copright{
width: max-content;
height:20px;
color:#FCDA7C ;
background:#333;;
border: 1px solid #FCDA7C;
bottom: 6px;
}
.center_bottom ul li a{
font-size: 16px;
color: #666;
}
.list_bottom{
color: #999;
font-size: 12px;
margin-top: 3px;
display: none;
}
.ttt{
width:239.67 ;
height: 518.67px;
/* opacity: 0; */
background: #999;
/* z-index: 100; */
overflow: hidden;
border-radius: 9px;
}

View File

@@ -0,0 +1,144 @@
<!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">
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_3889063_pzqt405pw6.css">
<link rel="stylesheet" href="../../public.css">
<link rel="stylesheet" href="../../clear.css">
<link rel="stylesheet" href="./千图网.css">
<title>千图网</title>
</head>
<body>
<div class="main">
<div class="center">
<div class="title">
<div class="hot">
<a>
<img src="https://static.qiantucdn.com/static/images/index/f-icon-118.png"></img>
<span>正在热门</span>
</a>
</div>
<ul class="title_menu">
<span>情人节</span>
浪漫告白季[情人节]营销素材|50000+作品
</ul>
</div>
<div class="center_bottom ">
<ul class="list">
<li>
<div class="ttt">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater"
alt="">
</div>
<a href="">
<p>
<span>情人节-地产刷屏</span>
<span class="list_bottom right">40张</span>
</p>
<p class="list_bottom">精选各类情人节地产借势海报,包含3D风...</p>
</a>
<div class="list_location">
<div class="list_count">40张</div>
<div class="list_copright">
<i class="iconfont icon-banquan"></i>正版
</div>
</div>
</li>
<li>
<div class="ttt">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater"
alt="">
</div>
<a href="">
<p>
<span>情人节-地产刷屏</span>
<span class="list_bottom right">40张</span>
</p>
<p class="list_bottom">精选各类情人节地产借势海报,包含3D风...</p>
</a>
<div class="list_location">
<div class="list_count">40张</div>
<div class="list_copright">
<i class="iconfont icon-banquan"></i>正版
</div>
</div>
</li>
<li>
<div class="ttt">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater"
alt="">
</div>
<a href="">
<p>
<span>情人节-地产刷屏</span>
<span class="list_bottom right">40张</span>
</p>
<p class="list_bottom">精选各类情人节地产借势海报,包含3D风...</p>
</a>
<div class="list_location">
<div class="list_count">40张</div>
<div class="list_copright">
<i class="iconfont icon-banquan"></i>正版
</div>
</div>
</li>
<li>
<div class="ttt">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater"
alt="">
</div>
<a href="">
<p>
<span>情人节-地产刷屏</span>
<span class="list_bottom right">40张</span>
</p>
<p class="list_bottom">精选各类情人节地产借势海报,包含3D风...</p>
</a>
<div class="list_location">
<div class="list_count">40张</div>
<div class="list_copright">
<i class="iconfont icon-banquan"></i>正版
</div>
</div>
</li>
<li>
<div class="ttt">
<img src="https://preview.qiantucdn.com/auto_machine/20230118/98d216e7-e96d-4131-8939-1a489384816f.jpg!qt576_nowater"
alt="">
</div>
<a href="">
<p>
<span>情人节-地产刷屏</span>
<span class="list_bottom right">40张</span>
</p>
<p class="list_bottom">精选各类情人节地产借势海报,包含3D风...</p>
</a>
<div class="list_location">
<div class="list_count">40张</div>
<div class="list_copright">
<i class="iconfont icon-banquan"></i>正版
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>

View File

@@ -0,0 +1,88 @@
.menu{
width: 700px;
height: 630px;
margin: 0 auto;
}
.menu_list{
width: 100%;
height: 210px;
}
.menu_list li{
width: 100%;
height: 210px;
float: left;
padding: 15px;
box-sizing: border-box;
}
.menu_list li:hover{
background: #f8f8f8;
}
.menu_list img{
width: 220px;
height: 180px;
float: left;
}
.list_text{
width: 424px;
height: 117px;
font-size:12px;
position: relative;
}
.list_text a{
display: block;
font-size:12px;
color:#666;
}
.list_bottom{
width: 424px;
height: 33px;
line-height: 33px;
font-size: 12px;
color: #666;
margin-top: 27px;
position: relative;
}
.list_bottom span{
margin-left: 5px;;
margin-right: 12px;
}
.list_bottom img {
width: 16px;
height: 16px;
border-radius: 50px;
position: absolute;
left:77px;
bottom: 7px ;
}
.app_drap{
width: auto;
height: 20px;
line-height: 20px;
font-size: 12px;
color: #ff9d00;
padding: 0 7px;
border: 1px solid #ff9d00;
border-radius: 11px;
}
.app_drap i{
width: 16px;
height: 16px;
margin: 2px;
display: block;
background: url(https://css.mafengwo.net/images/index-sprites8-v2@2x.png) no-repeat -170px 0;
background-size: 200px auto;
}
.app_drap:hover img{
display: inline-block;
}
.app_drap img{
width: 125px;
height: 175px;
position: absolute;
top: 24px;
right: 0;
z-index: 999;
display: none;
}

View File

@@ -0,0 +1,101 @@
<!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">
<link rel="stylesheet" href="http://at.alicdn.com/t/c/font_3889063_cqgsvc9i2kj.css">
<link rel="stylesheet" href="../../clear.css">
<link rel="stylesheet" href="../../public.css">
<link rel="stylesheet" href="./马蜂窝.css">
<title>马蜂窝</title>
</head>
<body>
<div class="menu">
<ul class="menu_list">
<li>
<img src="https://p1-q.mafengwo.net/s19/M00/33/53/CoNH1mPn2RBXYAuEAAeIX5c_RlA.jpeg?imageMogr2%2Fthumbnail%2F%21440x300r%2Fstrip%2Fgravity%2FCenter%2Fcrop%2F%21440x300%2Fquality%2F90"
alt="">
<div class="list_text right">
<a class="app_drap right" style="color: #ff9d00" href="">
<i class="left"></i>
APP
<img src="https://b2-q.mafengwo.net/s12/M00/6E/DD/wKgED1uu232AMKEvAAAz-ljBM0k929.png" alt="">
</a>
<a href="">【日本】雪地上撒点野(高山&京都11日:雪地温泉、高山缆车、...</a>
<a href="">2023年即将开启人生的新旅程啦~ 在出发之前,决定把之前的几篇游记都搬过来~感谢马蜂窝的小编这几年来对我的鼓励和认可! 此篇游记的行程发生在2018年春节~
当时的设备和拍照技巧都还很烂(...</a>
</div>
<div class="list_bottom right">
<i class="iconfont icon-31dingwei"></i>
<span>日本,by</span>
<img src="https://p1-q.mafengwo.net/s9/M00/BC/B8/wKgBs1aVqYWADGeIAAJ1KgfMQuc45.jpeg?imageMogr2%2Fthumbnail%2F%2116x16r%2Fgravity%2FCenter%2Fcrop%2F%2116x16%2Fquality%2F90"></img>
<span>人歌没有毒</span>
<i class="iconfont icon-mianxing-yanjing"></i>
<span>3482</span>
<div class="right">
<span>50</span>
<i class="iconfont icon-zhiding"></i>
</div>
</div>
</li>
<li>
<img src="https://p1-q.mafengwo.net/s19/M00/33/53/CoNH1mPn2RBXYAuEAAeIX5c_RlA.jpeg?imageMogr2%2Fthumbnail%2F%21440x300r%2Fstrip%2Fgravity%2FCenter%2Fcrop%2F%21440x300%2Fquality%2F90"
alt="">
<div class="list_text right">
<a class="app_drap right" style="color: #ff9d00" href="">
<i class="left"></i>
APP
<img src="https://b2-q.mafengwo.net/s12/M00/6E/DD/wKgED1uu232AMKEvAAAz-ljBM0k929.png" alt="">
</a>
<a href="">【日本】雪地上撒点野(高山&京都11日:雪地温泉、高山缆车、...</a>
<a href="">2023年即将开启人生的新旅程啦~ 在出发之前,决定把之前的几篇游记都搬过来~感谢马蜂窝的小编这几年来对我的鼓励和认可! 此篇游记的行程发生在2018年春节~
当时的设备和拍照技巧都还很烂(...</a>
</div>
<div class="list_bottom right">
<i class="iconfont icon-31dingwei"></i>
<span>日本,by</span>
<img src="https://p1-q.mafengwo.net/s9/M00/BC/B8/wKgBs1aVqYWADGeIAAJ1KgfMQuc45.jpeg?imageMogr2%2Fthumbnail%2F%2116x16r%2Fgravity%2FCenter%2Fcrop%2F%2116x16%2Fquality%2F90"></img>
<span>人歌没有毒</span>
<i class="iconfont icon-mianxing-yanjing"></i>
<span>3482</span>
<div class="right">
<span>50</span>
<i class="iconfont icon-zhiding"></i>
</div>
</div>
</li>
<li>
<img src="https://p1-q.mafengwo.net/s19/M00/33/53/CoNH1mPn2RBXYAuEAAeIX5c_RlA.jpeg?imageMogr2%2Fthumbnail%2F%21440x300r%2Fstrip%2Fgravity%2FCenter%2Fcrop%2F%21440x300%2Fquality%2F90"
alt="">
<div class="list_text right">
<a class="app_drap right" style="color: #ff9d00" href="">
<i class="left"></i>
APP
<img src="https://b2-q.mafengwo.net/s12/M00/6E/DD/wKgED1uu232AMKEvAAAz-ljBM0k929.png" alt="">
</a>
<a href="">【日本】雪地上撒点野(高山&京都11日:雪地温泉、高山缆车、...</a>
<a href="">2023年即将开启人生的新旅程啦~ 在出发之前,决定把之前的几篇游记都搬过来~感谢马蜂窝的小编这几年来对我的鼓励和认可! 此篇游记的行程发生在2018年春节~
当时的设备和拍照技巧都还很烂(...</a>
</div>
<div class="list_bottom right">
<i class="iconfont icon-31dingwei"></i>
<span>日本,by</span>
<img src="https://p1-q.mafengwo.net/s9/M00/BC/B8/wKgBs1aVqYWADGeIAAJ1KgfMQuc45.jpeg?imageMogr2%2Fthumbnail%2F%2116x16r%2Fgravity%2FCenter%2Fcrop%2F%2116x16%2Fquality%2F90"></img>
<span>人歌没有毒</span>
<i class="iconfont icon-mianxing-yanjing"></i>
<span>3482</span>
<div class="right">
<span>50</span>
<i class="iconfont icon-zhiding"></i>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>