一款跳转警告HTML单页模板,源码由HTML+CSS+JS组成,记事本打开源码文件可以进行内容文字之类的修改，双击html文件可以本地运行效果，也可以上传到服务器里面，重定向这个界面
代码如下
<!DOCTYPE html>
<html>
<!--QQ沐编程 www.qqmu.com 学习QQ群：290987565 域名抢注 33210.jm.cn -->
<head>
<title>Warning!</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
<style>
* {
box-sizing: border-box;
}
body {
background: #F4696A;
margin: 0;
}
body div {
position: absolute;
top: calc(50% - 207px);
width: 100%;
}
body div i {
font-style: normal;
width: 200px;
height: 200px;
line-height: 200px;
border-radius: 100%;
display: block;
margin: 0 auto;
background: #fff;
text-align: center;
color: #F4696A;
font-size: 6em;
font-family: "Microsoft YaHei";
}
body div p,
body div h2 {
color: #fff;
text-align: center;
margin: 0;
margin-top: 20px;
}
body div blockquote {
background: #fff;
text-align: center;
max-width: 352px;
margin: 0 auto;
margin-top: 20px;
border-radius: 6px;
padding: 10px;
overflow-y: auto;
color: #5a5f69;
}
body div blockquote::-webkit-scrollbar {
width: 6px;
height: 6px;
}
body div blockquote::-webkit-scrollbar-thumb {
border-radius: 10px;
background-color: #888;
}
body div a,
body div a:hover,
body div a:focus {
transition: all .35s;
width: 100px;
display: block;
color: #fff;
margin: 0 auto;
margin-top: 20px;
text-decoration: none;
outline: none;
border: 1px solid #fff;
border-radius: 6px;
text-align: center;
line-height: 33px;
}
body div a:hover {
background: rgba(255, 255, 255, .2);
}
</style>
</head>
<body>
<div>
<i>!</i>
<h2>警告</h2>
<p>小伙子，前面的路很危险，你确定要继续向前吗？</p>
<blockquote>https://www.qqmu.com/</blockquote>
<a href="https://www.qqmu.com/">继续深♂入</a>
</div>
</body>
</html>
