404页面

已于 2022-04-19 14:55:07 修改
阅读量158 收藏
点赞数
文章标签： html
于 2022-04-19 14:53:47 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zcy1005/article/details/124273833
版权 
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Folkspace</title>
    <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
  </head>
  <style>
        *{
    	margin:0;
    	padding:0;
    }
    body{
    	font-family: 'Open Sans', sans-serif;
    	font-size: 14px;
    	color: #3c3c3c;
    	background-color: #ECECEC;
    }


    #duobei_wrap{
    	float: left;
    	position: relative;
    	width: 600px;
    	/*height: 600px;*/
    	margin-top: 150px;
    	/*margin-left: 100px;*/
    	-webkit-traisition: all 1s ease-out;
    	-moz-traisition: all 1s ease-out;
    	-o-traisition: all 1s ease-out;
    	traisition: all 1s ease-out;
    }
    #duobei{
    	margin: 60px auto;
    	position: absolute;
    	-webkit-transform: rotate(-30deg);
    	-moz-transform: rotate(-30deg);
    	-o-transform: rotate(-30deg);
    	transform: rotate(-30deg);
    	-webkit-transition: all 1s ease-in-out;
    	-webkit-transform-origin: 50%;
    	transition: all 1s ease-in-out;
    	transform-origin: 50%;
    }




    .fl {float:left;display:inline;}
    .fr {float:right;display:inline;}
    .cf {display:block;zoom:1;}
    * html .cf {height:1%;}
    .cf:after {content:" ";display:block;height:0;clear:both;visibility:hidden;}

    .logo_wrap{
    	height: 84px;
    }
    #logo{
    	float: left;
    	width: 83px;
    	height: 70px;
    	padding-top: 10px;
    	display: inline-block;
    	background: url(./favicon.ico) no-repeat;
    }
    #title{
    	float: left;
    	line-height: 80px;
    	margin-left: 20px;
    	display: inline-block;
    }

    i{
    	display: inline-block;
    	font-size: 24px;
    	font-family: "Microsoft YaHei";
    	font-style: normal;
    	-webkit-animation-duration: 1.4s;/*动画持续时间*/
        -webkit-animation-iteration-count: 1;/*定义循环资料，infinite为无限次*/
        -webkit-animation-timing-function: ease;/*动画频率*/

        animation-duration: 1.4s;
        animation-iteration-count: 1;
        animation-timing-function: ease;
    }
    i:nth-child(-n+2){
    	color: #00b7fa;
    	font-size: 24px;
    }
    i:nth-child(n+3){
    	color: #666;
    	font-size: 24px;
    }

    .title_move i:nth-child(1){
    	-webkit-animation-name:'zoom-d';
    	animation-name:'zoom-d';
    }
    .title_move i:nth-child(2){
    	-webkit-animation-name:'zoom-b';
    	animation-name:'zoom-b';
    }
    .title_move i:nth-child(3){
    	-webkit-animation-name:'zoom-g';
    	animation-name:'zoom-g';
    }
    .title_move i:nth-child(4){
    	-webkit-animation-name:'zoom-k';
    	animation-name:'zoom-k';
    }
    .title_move i:nth-child(5){
    	-webkit-animation-name:'zoom-c';
    	animation-name:'zoom-c';
    }
    .title_move i:nth-child(6){
    	-webkit-animation-name:'zoom-o';
    	animation-name:'zoom-o';
    }
    .title_move i:nth-child(7){
    	-webkit-animation-name:'zoom-p';
    	animation-name:'zoom-p';
    }
    .title_move i:nth-child(8){
    	-webkit-animation-name:'zoom-q';
    	animation-name:'zoom-q';
    }
    .title_move i:nth-child(9){
    	-webkit-animation-name:'zoom-r';
    	animation-name:'zoom-r';
    }


    @-webkit-keyframes 'zoom-d' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        10% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        30% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        50% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
        100% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-b' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        20% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        40% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        60% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-g' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        30% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        70% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-k' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        40% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        60% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        80% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-c' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        70% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        90% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-o' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        70% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        90% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-p' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        70% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        90% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }


    @-webkit-keyframes 'zoom-q' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        70% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        90% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }

    @-webkit-keyframes 'zoom-r' {
        0% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        50% {
            -webkit-transform: scale(0.6);
            transform: scale(0.6);
            opacity: 0;
        }
        70% {
            -webkit-transform: scale(1.1)
            transform: scale(1.1)
        }
        90% {
            -webkit-transform: scale(1);
            transform: scale(1);
            opacity: 1.0
        }
    }
    .not_found_tip{
    /*	float: left;*/
    	text-align: left;
    	color: #666;
    	font-family: "Microsoft YaHei";
    	font-size: 20px;
    	text-shadow: 0 1px 0 #fff;
    	letter-spacing: 1px;
    	line-height: 2em;
    	text-indent: 18px;
    	-webkit-transform: rotate(0deg);
    	transform: rotate(0deg);
    }
    .reason{
    	margin-top: 54px;
    	display: block;
    }
    .possible{
    	font-weight: bold;
    	text-indent: 18px;
    	margin-top: 10px;
    }
    .reason ul{
    	list-style: square;
    	padding-left: 82px;
    	margin-top: 10px;
    }
    .reason li{
    	line-height: 22px;
    	margin: 8px 0;
    }



    .line{
    	float: left;
    	width: 1px;
    	height: 400px;
    	margin-left: 50px;
    	margin-top: 100px;
    	background: #ddd;
    	box-shadow: 1px 0 2px #FFF;
    }




    #content{
    	width: 1202px;
    	margin: 0 auto;
    }
    .not_found{
    	float: right;
    	width: 400px;
    	height: auto;
    	margin-top: 150px;
    	position: relative;
    }

    .not_found_404 {
      text-align: center;
      font-family: cursive,sans-serif;
      font-size: 150px;
      font-weight: bold;
      line-height: 150px;
      letter-spacing: 25px;
      color: #fff;
      -webkit-transform: rotate(18deg);
      		  transform: rotate(18deg);
      -webkit-transform-origin: 12% 60%;
       transform-origin: 12% 60%;
    }

    .not_found_404 span {
    	float: left;
      	cursor: pointer;
      	text-shadow: 0px 0px 2px #686868,
    	    0px 1px 1px #ddd,
    	    0px 2px 1px #d6d6d6,
    	    0px 3px 1px #ccc,
    	    0px 4px 1px #c5c5c5,
    	    0px 5px 1px #c1c1c1,
    	    0px 6px 1px #bbb,
    	    0px 7px 1px #777,
    	    0px 8px 3px rgba(100, 100, 100, 0.4),
    	    0px 9px 5px rgba(100, 100, 100, 0.1),
    	    0px 10px 7px rgba(100, 100, 100, 0.15),
    	    0px 11px 9px rgba(100, 100, 100, 0.2),
    	    0px 12px 11px rgba(100, 100, 100, 0.25),
    	    0px 13px 15px rgba(100, 100, 100, 0.3);
    	-webkit-transition: all .1s linear;
    	transition: all .1s linear;
    }

    .not_found_404 span:hover {
      text-shadow: 0px 0px 2px #686868,
        0px 1px 1px #fff,
        0px 2px 1px #fff,
        0px 3px 1px #fff,
        0px 4px 1px #fff,
        0px 5px 1px #fff,
        0px 6px 1px #fff,
        0px 7px 1px #777,
        0px 8px 3px #fff,
        0px 9px 5px #fff,
        0px 10px 7px #fff,
        0px 11px 9px #fff,
        0px 12px 11px #fff,
        0px 13px 15px #fff;
      -webkit-transition: all .1s linear;
      transition: all .1s linear;
    }

    .ribbon {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 130px;
    	height: 40px;
    	background: rgba(0, 0, 0, 0.1);
    	background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    	background: -moz-linear-gradient(555% 0% 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    	border-left: 1px dashed rgba(0, 0, 0, 0.1);
    	border-right: 1px dashed rgba(0, 0, 0, 0.1);
    	box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    	/*-webkit-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    	-moz-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    	-o-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    	transform: rotate(6deg) skew(0,0) translate(-60%,-5px);*/
    }

    @-webkit-keyframes 'not'{
    	0%{

    	}
    	25%{
    		-webkit-transform: rotate(12deg);
    	}
    	50%{
    		-webkit-transform: rotate(18deg);
    	}
    	75%{
    		-webkit-transform: rotate(12deg);
    	}
    	100%{
    		-webkit-transform: rotate(18deg);
    	}

    }
    .not_found_404{
    	-webkit-animation-duration: 4s;
    	-webkit-animation-name: not;
    	-webkit-animation-iteration-count: infinite;
    	-webkit-animation-timing-function: ease-in-out;
    }
    .btn{
    	width: 100%;
    	margin-top: 100px;
    }

    .button{
    	-webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
    	-moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
    	box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
    	background-color: #ffffff;
    	background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, whitesmoke), color-stop(100%, #fff));
    	background: -webkit-linear-gradient(top, whitesmoke, #fff);
    	background: -moz-linear-gradient(top, whitesmoke, #fff);
    	background: -o-linear-gradient(top, whitesmoke, #fff);
    	background: linear-gradient(top, whitesmoke, #fff);
    	display: -moz-inline-stack;
    	display: inline-block;
    	vertical-align: middle;
    	zoom: 1;
    	border: 1px solid #d4d4d4;
    	height: 32px;
    	line-height: 32px;
    	padding: 0px 25.6px;
    	font-weight: 300;
    	font-size: 14px;
    	font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    	color: #666666;
    	text-shadow: 0 1px 1px white;
    	margin: 0;
    	text-decoration: none;
    	text-align: center;
    	-webkit-border-radius: 30px;
    	-moz-border-radius: 30px;
    	-ms-border-radius: 30px;
    	-o-border-radius: 30px;
    	border-radius: 30px;

    	-moz-animation:funny 3s linear infinite;
    	-o-animation:funny 3s linear infinite;
    	animation:funny 3s linear infinite;
    	-webkit-animation:funny 3s linear infinite;

    	margin-right: 40px;
    	clear: left;
    }

    @-webkit-keyframes funny{
    	0% { -webkit-box-shadow:0px 0px 0px whitesmoke; }
    	50% { -webkit-box-shadow:0px 0px 20px rgba(82, 168, 236, 0.8); }
    	100% { -webkit-box-shadow:0px 0px 0px whitesmoke; }
    }
    @-moz-keyframes funny{
    	0% { -moz-box-shadow:0px 0px 0px whitesmoke; }
    	50% { -moz-box-shadow:0px 0px 20px rgba(82, 168, 236, 0.8); }
    	100% { -moz-box-shadow:0px 0px 0px whitesmoke; }
    }
  </style>
  <body>
    <div id="content" class="cf">
      <div id="duobei_wrap">
        <div class="logo_wrap cf">
          <a href="http://www.duobei.com/" id="logo"></a>
          <div id="title">
            <i>a</i><i>b</i><i>c</i><i>d</i><i>e</i><i>f</i><i>g</i><i>h</i
            ><i>e</i>
          </div>
        </div>
        <div class="reason">
          <p class="not_found_tip">Not Found :( 很抱歉，您访问的页面不存在!</p>
          <p class="possible">可能原因：</p>
          <ul>
            <li>
              该数据已被删除，但却被搜索引擎收录了，通过搜索引擎访问就会看到此页面
            </li>
            <li>
              您手动输入了一个从来没有的访问url，这样系统也是无法识别您的url，报错
            </li>
          </ul>
        </div>
      </div>
      <!-- #duobei_wrap -->
      <div class="line"></div>

      <div class="not_found">
        <i class="ribbon"></i>
        <div class="not_found_404 cf">
          <span>4</span>
          <span>0</span>
          <span>4</span>
        </div>
        <div class="btn">
          <a href="http://www.duobei.com/" class="button button-rounded"
            >看看首页</a
          >
          <a href="#" class="button button-rounded cancle">返回上页</a>
        </div>
      </div>
      <!-- not_found -->
    </div>
  </body>
  <script>
    $(function(){
	var time=setTimeout(function(){
		$("#duobei").css({
			"-webkit-transform": "rotate(-30deg) scale(0.5)",
		});
	},2000);

	$("#title").hide();
	var title=setTimeout(function(){
		$("#title").addClass("title_move");
		$("#title").show();
	},400);

	var duobeiWrap=setTimeout(function(){
		// $("#duobei_wrap").css({"float":"left"});
	},3400);

	$(".cancle").click(function(){
		window.history.go(-1);
		return false;
	});

	// var time=setTimeout(function(){
	// 	window.location.href="http://www.baidu.com/";
	// },15000);
})

  </script>
</html>

心想事成--
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
自适应404页面
毛兴宇
04-15 2747
404.CSS *{ padding:0;margin:0;box-sizing:border-box;font-family:"微软雅黑";} body,html{width:100%;height:100%;} .container{max-width:90%;margin:0 auto;padding:80px 0px; } img{-webkit-user-select:none;-m...
uniapp 404页面
mygoes
11-01 3117
uniapp 404 页面 需求：uniapp 在写 H5 时，如果在地址栏乱输入，会跳转到 404 页面。 思路：uniapp 有个 应用生命周期 onPageNotFound，让跳转不存在的页面时会执行这个回调函数。所以需求就很好解决了！ 具体操作： 第一步：写一个 404 页面，并在 pages.json 中配置其路由。 第二步：在 App.vue 的 onPageNotFound 生命周期中处理跳转到 404 页面的逻辑： // App.vue 文件： export default {
如何制作404页面
娄晓沫
03-15 2503
第一步：选取你喜欢的404页面，右键查看源代码，全选复制。 第二步：粘贴刚才复制的代码到编辑器，更改对应的跳转链接，文字，以及页面的标题，404图片路径。查看修改编码方式，如不修改可能出现乱码，命名为404.html。 第三步：制作404图片，将图片保存到桌面。 第四步：打开404.html，没有问题后上传到网站根目录，图片上传到对应的图片路径 第五步：在主机管理后台-基础环境设置...
html: 404界面
renjingzhaozhao的博客
05-19 1512
body <div class="figure"> <div class="mj"> <div class="head"> <div class="nose"></div> <div class="hair"> <div class="ponytail"></div> <div class="frontpony"></...
网站怎么设置404页面
驰网云儿
10-28 5621
404页面是网站优化中必不可少的基础优化之一，随着网站运营时间的不断延长，网站上原来的网页内容可能会被删除，但是该网页的链接地址往往会以各种内链、外链形式存在，如果使用的是一些锚文本链接，这些文字内容可能会吸引到用户点击，而对应的页面却已经删除，此时如果没有设置404页面，那么用户获得的页面就是一个错误的页面，而搜索引擎 获得的路径则变成了死路。正因如此又将这类链接称之为死链 一、什么是404页面 404页面是客户端在浏览网页时，服务器无法正常提供信息，或是服务器无法回应，且不知道原因所返回的页面。
４０４页面源码.rar
04-04
404页面是Web开发中的一个重要元素，当用户尝试访问不存在的URL时，服务器会返回一个404错误状态码，并显示相应的404错误页面。这个页面的设计和内容能够帮助用户理解发生了什么问题，同时提供指引，让他们能方便地...
咖啡404页面
08-25
在IT行业中，404页面是一个非常重要的概念，它与网站的用户体验和错误处理机制紧密相关。404页面，正如其名“咖啡404页面”，是指当用户尝试访问一个不存在或者已被移除的网页时，服务器返回的一个特定错误页面。这...
定制 404 页面的一些心得
09-30
定制404页面是网站设计中一个非常重要的方面，它对于提升用户体验和搜索引擎优化（SEO）都有着不可忽视的作用。404页面是当用户尝试访问网站中不存在的页面时所看到的页面。一个设计得当的404页面不但可以减少用户因...
月球宇航员飞行404页面
06-24
【月球宇航员飞行404页面】是一款极具创意的网页设计模板，主要用于构建吸引用户的404错误页面。404页面是用户在访问网站时遇到的常见问题，通常表示请求的网页不存在或已被移除。设计一个有趣的404页面能够提升用户...
404页面模版
05-15
404页面模板是网页设计中的一个重要组成部分，它在用户访问网站时遇到错误链接或页面不存在的情况下显示。这种模板的设计不仅具有实用性，还承载着提升用户体验和品牌展示的功能。一个美观且富有创意的404页面可以...
JS UI库DHTMLX Suite v8.4全新发布——图表、网格组件等API全面升级
需要界面开发、IDE工具研发中文教程资料的小伙伴，记得私信我~
08-13 601
本文将为大家介绍强大JavaScript UI库DHTMLX Suite v8.4新功能，欢迎下载新版体验！
3：html（CSS)：基础语法3
最新发布
2301_76578848的博客
08-17 300
在这篇文章中，介绍了网页布局与id的内容，从而将网页更加美观，越来越贴近大家平时看到的网页了。当然现在的网页离成功还是有很大的路要走。
html+css 实现hover 边框彩色按钮
宝码香车的博客
08-14 830
这是一个，hover后按钮边框变彩色的效果。附具体代码，深入理解，彻底掌握！可以一键复制，查看效果。
salesforce rich text 字段支持html中内嵌JavaScript吗
Debug yourself!
08-13 417
如果你尝试在 Salesforce 的富文本字段中插入 JavaScript，代码会被过滤掉。推荐的方式是在适当的地方使用 Salesforce 支持的 JavaScript 功能，比如自定义按钮、Visualforce 页面或 Lightning 组件，而不是在富文本字段中直接嵌入脚本代码。
Javaweb学习之HTML（二）
2301_80841939的博客
08-17 242
TML 响应式 Web 设计（Responsive Web Design, RWD）是一种网页设计方法，它使得网站能够根据不同的访问设备（如桌面电脑、平板电脑、智能手机等）的屏幕尺寸和分辨率来自动调整布局、图片大小、字体等，从而提供最佳的浏览体验。但是，请注意，在HTML文档中直接使用Unicode编码字符时，需要确保文档的编码（如UTF-8）能够支持这些字符。HTML5引入了一些新的字符实体，主要用于表示一些数学符号、技术符号以及特殊字符等，但这些新的字符实体在日常的HTML编码中并不常用。
html 关于table合并外边框以及自动滚动问题汇总
lfl18326162160的博客
08-13 241
固定高度显示上下滑动。
html+css+js网页设计 电商模版4个页面
qq_42431718的博客
08-13 351
html+css+js网页设计 电商模版4个页面 带js 网页作品代码简单，可使用任意HTML编辑软件（如：Dreamweaver、HBuilder、Vscode 、Sublime 、Webstorm、Text 、Notepad++ 等任意html编辑软件进行运行及修改编辑等操作）。
2：html：基础语法2
2301_76578848的博客
08-15 1237
首先，表头的话是使用标签，但是他同样也是一行，所以表头，应该在下面，也就是说，要先创建一个行，然后再写自己想要的表头。可以看到其他的上面是一样的，在中是新的，代表是一张表格，然后代表是一行，是一行中的一个个模块，然后第二个指的是第二行的内容，结果就是如下。这个就是我的主页面中我的头像，你看到还有之前学的照片的运用方式，同样，在网页中，我们习惯性的将他分成一个一个块，然后每一个快都是用的标签进行操作。还有没有我们经常用的边框，与表头。
前端（HTML + CSS）小兔鲜儿项目（仿）
li3123537691的博客
08-09 873
这是一个简单的商城网站，代码部分为HTML + CSS 和少量JS代码。
nginx404页面转发
05-27
要实现nginx的404页面转发，可以采用以下步骤： 1. 在nginx的配置文件中定义一个自定义的404错误页面，例如： ``` error_page 404 /404.html; location = /404.html { internal; } ``` 这里定义了一个404错误页面的路径为/404.html，并且设置了internal参数，表示这个页面只能在nginx内部访问，不能被外部直接访问。 2. 在nginx的配置文件中定义一个转发规则，将404请求转发到指定的页面或接口上，例如： ``` location /404 { proxy_pass http://www.example.com/404; } ``` 这里定义了一个转发规则，将所有以/404开头的请求都转发到http://www.example.com/404接口上。 注意：这里的http://www.example.com/404可以是任何一个能够处理404请求的页面或接口。 3. 在转发的页面或接口中处理404请求，例如： ``` <?php header("HTTP/1.1 404 Not Found"); header("Location: http://www.example.com/custom_404_page.html"); exit; ?> ``` 这里使用PHP语言的header函数将HTTP状态码设置为404，并将页面重定向到自定义的404页面上。 注意：这里的http://www.example.com/custom_404_page.html可以是任何一个自定义的404页面的路径。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值