Skip to content

Commit 274861c

Browse files
author
zhaolq
committed
Site updated: 2025-03-21 10:46:15
1 parent 7f3391c commit 274861c

File tree

3,546 files changed

+483070
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

3,546 files changed

+483070
-0
lines changed

404.html

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
<!DOCTYPE html>
2+
<html lang="zh-CN">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>404 页面未找到</title>
7+
<style>
8+
/* 页面整体样式 */
9+
body {
10+
margin: 0;
11+
padding: 0;
12+
font-family: 'Arial', sans-serif;
13+
background-color: #eee;
14+
height: 100vh;
15+
display: flex;
16+
justify-content: center;
17+
align-items: center;
18+
overflow: hidden;
19+
text-align: center;
20+
}
21+
22+
/* 404数字 */
23+
h1 {
24+
font-size: 150px;
25+
color: #3498db;
26+
margin: 0;
27+
font-weight: bold;
28+
text-shadow: 0 0 20px rgba(52, 152, 219, 0.5), 0 0 30px rgba(52, 152, 219, 0.3);
29+
animation: bounce 1.5s ease-in-out infinite;
30+
}
31+
32+
/* 动画:跳动效果 */
33+
@keyframes bounce {
34+
0% {
35+
transform: scale(1);
36+
}
37+
30% {
38+
transform: scale(1.1);
39+
}
40+
50% {
41+
transform: scale(1);
42+
}
43+
70% {
44+
transform: scale(1.1);
45+
}
46+
100% {
47+
transform: scale(1);
48+
}
49+
}
50+
51+
/* 提示文本 */
52+
p {
53+
font-size: 22px;
54+
color: #333;
55+
margin-top: 20px;
56+
opacity: 0;
57+
animation: fadeIn 1s ease-in-out forwards;
58+
}
59+
60+
/* 渐显效果 */
61+
@keyframes fadeIn {
62+
0% {
63+
opacity: 0;
64+
transform: translateY(30px);
65+
}
66+
100% {
67+
opacity: 1;
68+
transform: translateY(0);
69+
}
70+
}
71+
72+
/* 返回首页按钮 */
73+
.btn {
74+
display: inline-block;
75+
background-color: #3498db;
76+
color: white;
77+
font-size: 18px;
78+
padding: 12px 30px;
79+
border-radius: 50px;
80+
text-decoration: none;
81+
margin-top: 30px;
82+
transition: background-color 0.3s, transform 0.3s;
83+
opacity: 0;
84+
animation: fadeIn 2s ease-in-out forwards;
85+
animation-delay: 1s;
86+
}
87+
88+
/* 按钮悬停效果 */
89+
.btn:hover {
90+
background-color: #2980b9;
91+
transform: translateY(-5px);
92+
}
93+
94+
/* 背景闪烁效果 */
95+
.stars {
96+
position: absolute;
97+
top: 0;
98+
left: 0;
99+
width: 100%;
100+
height: 100%;
101+
background: url('./images/404_background_stardust.png');
102+
opacity: 0.1;
103+
pointer-events: none;
104+
animation: starsBlink 3s ease-in-out infinite;
105+
}
106+
107+
/* 星星闪烁动画 */
108+
@keyframes starsBlink {
109+
0%, 100% {
110+
opacity: 0.1;
111+
}
112+
50% {
113+
opacity: 0.3;
114+
}
115+
}
116+
117+
</style>
118+
</head>
119+
<body>
120+
121+
<div class="stars"></div>
122+
123+
<div class="content">
124+
<h1>404</h1>
125+
<p>抱歉,您访问的资源不存在!</p>
126+
<a href="javascript:history.go(-1);" class="btn">返回上一页</a>
127+
</div>
128+
129+
</body>
130+
</html>

CNAME

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
blog.zhaolq.com

0 commit comments

Comments
 (0)