网址跳转警告页面HTML代码

公告:荻酷网每天不定时为大家更新各种实用技术教程、编曲资源,脚本源代码,插件,软件应用等资讯、绝大部分资源都经过亲测演示,下载荻酷网客户端、获取最新资源不迷路。 下载说明:如果是种子链接请下载专用工具进行下载,其它网盘链接可直接访问下载。

源码介绍

这是一款跳转警告HTML单页模板源码,可以做域名跳转中转页,用来做广告链接跳转,新建一个html文件,将下面代码拷贝到html里面保存,鼠标双击html文件可以查看效果,或者上传到服务器上面进行使用,喜欢的可以拿去研究

截图预览

20240604132937413-QQ截图20240604132906

代码如下

<!DOCTYPE html>
<html>

<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.cndkk.com/</blockquote>
        <a href="https://www.cndkk.com/">继续深♂入</a>
    </div>
</body>
</html>

 

    温馨提示:本文最后更新于2024-06-04 13:37:32,某些文章具有时效性,若有错误或已失效,请在下方留言
    ©版权声明
    感谢您的阅读
    喜欢就支持一下吧
    点赞12赞赏 分享
    评论 抢沙发
    头像
    欢迎您留下宝贵的见解!
    提交
    头像

    昵称

    夸夸
    还有吗!没看够!
    取消
    昵称表情代码图片

      暂无评论内容