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

88
历届学生/陈一航/2020-03-23/demo.html Normal file
View File

@@ -0,0 +1,88 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>相框掉落</title>
<style>
html {
width: 100%;
height: 100%;
}
body {
margin: 0;
padding: 0;
width: 100%;
height: 100%;
background: url("qiang.jpg");
position: relative;
animation: doudong 0.3s 4 reverse;
overflow: hidden;
}
.box {
width: 400px;
border: 10px solid #000;
background: url("./xk_1.jpeg");
background-size: contain;
height: 248px;
margin: 0 auto;
position: absolute;
left: 50%;
margin-left: -200px;
animation: qxie 0.1s ease-out 1.5s forwards;
transform-origin: 0px 0px;
}
@keyframes doudong {
0% {
background-position: 0 0;
left: 0;
}
50% {
background-position: 10px 0;
left: 10px;
}
100% {
background-position: 0 0;
left: 0;
}
}
@keyframes qxie {
0% {
top: 0;
transform: rotate(0deg);
}
50% {
top: 0;
transform: rotate(60deg);
}
70% {
top: 50%;
transform: rotate(60deg);
}
80% {
top: 70%;
transform: rotate(60deg);
}
100% {
top: 100%;
transform: rotate(60deg);
}
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>

32
历届学生/陈一航/2020-03-23/index.html Normal file
View File

@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>过渡</title>
<style>
.box {
width: 100px;
height: 100px;
border: 1px solid #000;
animation: Dh 3s ease infinite reverse;
}
@keyframes Dh {
from {
background: blue;
}
to {
background: green;
}
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>

42
历届学生/陈一航/2020-03-23/meda.html Normal file
View File

@@ -0,0 +1,42 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>媒体查询</title>
<style>
.box {
width: 200px;
height: 200px;
background: red;
}
@media screen and (min-width: 320px) and (max-width: 414px) {
.box {
background: blue;
}
}
@media screen and (min-width: 768px) and (max-width: 1024px) {
.box {
background: green;
}
}
@media screen and (min-width: 1025px) {
.box {
background: yellow;
}
}
</style>
</head>
<body>
<div class="box">
</div>
</body>
</html>

37
历届学生/陈一航/2020-03-23/meda/index.html Normal file
View File

@@ -0,0 +1,37 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>兼容pc和移动端的demo案例</title>
<style>
/* ui 框架 */
.pc {
}
.wap {
display: none;
}
@media screen and (min-width: 320px) and (max-width: 414px) {
.pc {
display: none;
}
.wap {
display: block;
}
}
</style>
</head>
<body>
<input type="text">
<div class="pc">pc端导航条</div>
<div class="wap">移动端导航条</div>
</body>
</html>

BIN
历届学生/陈一航/2020-03-23/qiang.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

BIN
历届学生/陈一航/2020-03-23/xk_1.jpeg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 263 KiB