单页404源码

news/2024/2/21 3:21:16

请添加图片描述


<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>简约 404错误页</title><link rel="shortcut icon" href="./favicon.png"><style>
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,600,700");
@import url("https://fonts.googleapis.com/css?family=Catamaran:400,800");
.error-container {text-align: center;font-size: 106px;font-family: "Catamaran", sans-serif;font-weight: 800;margin: 70px 15px;
}
.error-container > span {display: inline-block;position: relative;
}
.error-container > span.four {width: 136px;height: 43px;border-radius: 999px;background: linear-gradient(140deg,rgba(0, 0, 0, 0.1) 0%,rgba(0, 0, 0, 0.07) 43%,transparent 44%,transparent 100%),linear-gradient(105deg,transparent 0%,transparent 40%,rgba(0, 0, 0, 0.06) 41%,rgba(0, 0, 0, 0.07) 76%,transparent 77%,transparent 100%),linear-gradient(to right, #d89ca4, #e27b7e);
}
.error-container > span.four:before,
.error-container > span.four:after {content: "";display: block;position: absolute;border-radius: 999px;
}
.error-container > span.four:before {width: 43px;height: 156px;left: 60px;bottom: -43px;background: linear-gradient(128deg,rgba(0, 0, 0, 0.1) 0%,rgba(0, 0, 0, 0.07) 40%,transparent 41%,transparent 100%),linear-gradient(116deg,rgba(0, 0, 0, 0.1) 0%,rgba(0, 0, 0, 0.07) 50%,transparent 51%,transparent 100%),linear-gradient(to top, #99749d, #b895ab, #cc9aa6, #d7969e, #e0787f);
}
.error-container > span.four:after {width: 137px;height: 43px;transform: rotate(-49.5deg);left: -18px;bottom: 36px;background: linear-gradient(to right,#99749d,#b895ab,#cc9aa6,#d7969e,#e0787f);
}.error-container > span.zero {vertical-align: text-top;width: 156px;height: 156px;border-radius: 999px;background: linear-gradient(-45deg,transparent 0%,rgba(0, 0, 0, 0.06) 50%,transparent 51%,transparent 100%),linear-gradient(to top right,#99749d,#99749d,#b895ab,#cc9aa6,#d7969e,#ed8687,#ed8687);overflow: hidden;animation: bgshadow 5s infinite;
}
.error-container > span.zero:before {content: "";display: block;position: absolute;transform: rotate(45deg);width: 90px;height: 90px;background-color: transparent;left: 0px;bottom: 0px;background: linear-gradient(95deg,transparent 0%,transparent 8%,rgba(0, 0, 0, 0.07) 9%,transparent 50%,transparent 100%),linear-gradient(85deg,transparent 0%,transparent 19%,rgba(0, 0, 0, 0.05) 20%,rgba(0, 0, 0, 0.07) 91%,transparent 92%,transparent 100%);
}
.error-container > span.zero:after {content: "";display: block;position: absolute;border-radius: 999px;width: 70px;height: 70px;left: 43px;bottom: 43px;background: #fdfaf5;box-shadow: -2px 2px 2px 0px rgba(0, 0, 0, 0.1);
}.screen-reader-text {position: absolute;top: -9999em;left: -9999em;
}@keyframes bgshadow {0% {box-shadow: inset -160px 160px 0px 5px rgba(0, 0, 0, 0.4);}45% {box-shadow: inset 0px 0px 0px 0px rgba(0, 0, 0, 0.1);}55% {box-shadow: inset 0px 0px 0px 0px rgba(0, 0, 0, 0.1);}100% {box-shadow: inset 160px -160px 0px 5px rgba(0, 0, 0, 0.4);}
}/* demo stuff */
* {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;
}
body {background-color: #fdfaf5;margin-bottom: 50px;
}
html,
button,
input,
select,
textarea {font-family: "Montserrat", Helvetica, sans-serif;color: #bbb;
}
h1 {text-align: center;margin: 30px 15px;
}
.zoom-area {max-width: 490px;margin: 30px auto 30px;font-size: 19px;text-align: center;
}
.link-container {text-align: center;
}
a.more-link {text-transform: uppercase;font-size: 13px;background-color: #de7e85;padding: 10px 15px;border-radius: 0;color: #fff;display: inline-block;margin-right: 5px;margin-bottom: 5px;line-height: 1.5;text-decoration: none;margin-top: 50px;letter-spacing: 1px;
}
a {display: inline-block;text-transform: uppercase;font: 1em 'Roboto';font-weight: 300;border: 1px solid #2f8f7f;border-radius: 4px;color: #2f8f7f;margin-top: 10%;padding: 8px 14px;text-decoration: none;opacity: .6;text-align: center;
}
a:hover{border: 1px solid #e27b7e;color: #e27b7e;}
</style>
</head>
<body><h1>404 Error 本页面不存在</h1><p class="zoom-area"><b></b> 不是每次相遇都是巧合~ </p><section class="error-container"><span class="four"><span class="screen-reader-text">4</span></span><span class="zero"><span class="screen-reader-text">0</span></span><span class="four"><span class="screen-reader-text">4</span></span>
</section>
<p class="zoom-area">
<a href="https://www.qqmu.com/">返回首页</a>
<a href="http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=Y4By-EWjecaDw0euySk_OE8XwRogNm05&authKey=jLzq5pVhYF%2FIea%2BDmI2TMLzL67bFCZci3CoE9jDrCL13OAbV4eLGL6%2FNntOfXJDB&noverify=0&group_code=290987565">进入群聊</a>
</p></body>
</html>

https://www.xjx100.cn/news/3271415.html

相关文章

c++恶魔轮盘制造第1期输赢

小常识&#xff0c;恶魔叫DEALER&#xff0c;上帝叫God. 赢了很简单 void sheng() { cout<<"你获胜了&#xff01;";MessageBox(NULL,TEXT("你的钱~~~~~~给你"),TEXT("DEALER"),MB_OK);system("pause");system("cls"…

powershell 雅地关闭UDP监听器

在PowerShell中优雅地关闭UDP监听器意味着你需要一种机制来安全地停止正在运行的UdpClient实例。由于UdpClient类本身没有提供直接的停止或关闭方法&#xff0c;你需要通过其他方式来实现这一点。通常&#xff0c;这涉及到在监听循环中添加一个检查点&#xff0c;以便在接收到停…

使用 C++23 从零实现 RISC-V 模拟器(1):最简CPU

&#x1f449;&#x1f3fb; 文章汇总「从零实现模拟器、操作系统、数据库、编译器…」&#xff1a;https://okaitserrj.feishu.cn/docx/R4tCdkEbsoFGnuxbho4cgW2Yntc 本节实现一个最简的 CPU &#xff0c;最终能够解析 add 和 addi 两个指令。如果对计算机组成原理已经有所了…

MySQL篇----第十四篇

系列文章目录 文章目录 系列文章目录前言一、MySQL 数据库作发布系统的存储,一天五万条以上的增量,预计运维三年,怎么优化?二、锁的优化策略三、索引的底层实现原理和优化四、什么情况下设置了索引但无法使用前言 前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽…

模态、模式和真实发生

模态和模式均是用来描述某一对象或系统可能出现的特性、状态或行为&#xff0c;它们既包括逻辑上的抽象可能性&#xff0c;也涵盖现实中具体的现象和事件结构。模态更多地关联于逻辑可能性和必然性&#xff0c;而模式则侧重于现象的重复性和规律性&#xff0c;两者都可以反映真…

【Django】Django项目部署

项目部署 1 基本概念 项目部署是指在软件开发完毕后&#xff0c;将开发机器上运行的软件实际安装到服务器上进行长期运行。 在安装机器上安装和配置同版本的环境[python&#xff0c;数据库等] django项目迁移 scp /home/euansu/Code/Python/website euansuxx.xx.xx.xx:/home…

Java并发之ThreadLocal理解

Java并发之ThreadLocal理解 介绍使用场景 介绍 ThreadLocal是为实现对资源对象的线程隔离&#xff0c;使每个线程拥有自己的资源&#xff0c;避免并发时争用引发线程安全问题 实现原理&#xff1a; 主要是其内部存在一个ThreadLocalMap存储资源&#xff0c;将ThreadLocal对象自…

动态规划:解密优化问题的利器

在计算机科学和数学领域&#xff0c;动态规划&#xff08;Dynamic Programming&#xff09;是一种优化问题的方法。它通过将问题分解为更小的子问题&#xff0c;并将解决子问题的结果保存起来&#xff0c;从而避免了重复计算。动态规划在解决各种优化问题和决策问题中发挥着重要…