bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

111
历届学生/刘合群/2019-07-23/flex.html Normal file
View File

@@ -0,0 +1,111 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>弹性盒子 flex</title>
<style>
body,ul,li {
margin: 0;
padding: 0;
}
li {
list-style: none;
}
.header {
width: 100%;
overflow-x: scroll;
}
.header ul {
display: flex;
justify-content: space-around;
height: 50px;
align-items: center;
width: 112%;
}
.content {
margin-top: 31px;
}
.content ul {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
}
.content ul li {
width: 25%;
text-align: center;
}
.content ul li img {
width: 50px;
}
.search {
display: flex;
justify-content: space-between;
}
.search input{
flex-grow: 10;
}
.search p{
flex-grow: 1;
text-align: center;
}
</style>
</head>
<body>
<div class="search">
<input type="text" placeholder="小说名称">
<p>分类</p>
</div>
<div class="header">
<ul>
<li>精选</li>
<li>VIP(免费看)</li>
<li>男频</li>
<li>女频</li>
<li>漫画</li>
<li>仙侠</li>
</ul>
</div>
<div class="content">
<ul>
<li>
<img src="./icons.png" alt="">
<p>首页1</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页2</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页3</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页4</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页5</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页6</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页7</p>
</li>
<li>
<img src="./icons.png" alt="">
<p>首页8</p>
</li>
</ul>
</div>
</body>
</html>

BIN
历届学生/刘合群/2019-07-23/icons.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.9 KiB

BIN
历届学生/刘合群/2019-07-23/相框掉落/img/back.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 141 KiB

BIN
历届学生/刘合群/2019-07-23/相框掉落/img/me.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 45 KiB

BIN
历届学生/刘合群/2019-07-23/相框掉落/img/xk.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.3 MiB

79
历届学生/刘合群/2019-07-23/相框掉落/index.html Normal file
View File

@@ -0,0 +1,79 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>相框掉落</title>
<style>
body, html,.back {
height: 100%;
}
body, ul, li{
margin: 0;
padding: 0;
}
.back {
width: 100%;
background: url("./img/back.jpeg") no-repeat;
background-size: cover;
position: relative;
left: 0;
animation: backChange 0.1s 2s 6;
overflow: hidden;
}
.main {
width: 370px;
height: 226px;
background: #8d8d8d;
margin: 0 auto;
background: url("./img/xk.png");
background-size: cover;
position: relative;
transform-origin: 0 0;
transform: rotate(0deg);
top: 10px;
animation: xkChange 0.8s 2.6s 1 forwards;
}
.main img {
width: 259px;
height: 122px;
position: absolute;
left: 58px;
top: 53px;
}
@keyframes backChange {
from {
left: 0;
}
to {
left: 10px;
}
}
@keyframes xkChange {
0% {
top: 10px;
transform: rotate(0deg);
}
50% {
top: 10px;
transform: rotate(60deg);
}
100% {
transform: rotate(60deg);
top: 600px;
}
}
</style>
</head>
<body>
<div class="back">
<div class="main">
<img src="./img/me.jpeg" alt="">
</div>
</div>
</body>
</html>

1
历届学生/刘合群/2019-07-23/笔记.txt Normal file
View File

@@ -0,0 +1 @@
作用：主要用于移动端布局