[重要通告]如您遇疑難雜癥,本站支持知識(shí)付費(fèi)業(yè)務(wù),掃右邊二維碼加博主微信,可節(jié)省您寶貴時(shí)間哦!

今天想修改一個(gè)404頁(yè)面,想修改成類似騰訊那種公益404頁(yè)面的,那種感覺(jué)特別好,即使自己站點(diǎn)沒(méi)幾個(gè)流量,但這樣也可以盡一點(diǎn)點(diǎn)點(diǎn)的微薄之力吧,找了一圈,全部都是坑爹的貨,要么就是收費(fèi),要么就是很籠統(tǒng),都知道各位咋想的,一個(gè)公益404頁(yè)面,你收個(gè)錘子費(fèi)用,惡不惡心哦;今天老梁搞了一個(gè),具體看演示;

2022年9月2日更新:自適應(yīng)移動(dòng)端-演示圖如下圖所示

這里創(chuàng)建一個(gè)GY404.HTML文件,代碼如下所示:GY==公益

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>404</title>
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
</head>
<body>
<script class="bg" type="text/javascript" src="http://qzonestyle.gtimg.cn/qzone/hybrid/app/404/search_children.js" charset="utf-8" homePageUrl="/" homePageName="回到首頁(yè)"></script>
</body>
</html>

下面再創(chuàng)建一個(gè)404.CSS文件,用來(lái)自適應(yīng)移動(dòng)端,并作美化,代碼如下所示:

*{ padding:0;margin:0;box-sizing:border-box;}
body,html{width:100%;height:100%;}
.container{max-width:100%;margin:0 auto;}
iframe{max-width:100%;max-height:70%;}
.btn{width:400px;margin:0 auto;max-width:100%;max-height:80%;margin-top:40px;}
.btn a{float:left;text-decoration:none;width:46.5%;border:1px solid 
#5298ff;background:#5298ff;color:#FFF;display:block;height:42px; line-height:44px;text-align:center;font-size:16px;border-radius:3px;overflow:hidden;}
.btn .goindex{margin-right:7%;}
.btn .lx{border: 1px solid #d8d8d8;background:#ffffff;color:#8c8c8c;}
@media screen and (max-width: 500px){
.btn{ width:100%; }
.btn a{ width:100%; font-size:15px; height:42px; line-height:42px; }
.btn .goindex{ margin-right:0; margin-bottom:20px; }

最后,創(chuàng)建一個(gè)404.html文件,這個(gè)就是實(shí)際的404頁(yè)面,我們可以在這里有限制的隨便美化我們的公益404頁(yè)面,自定義我們的公益404頁(yè)面。代碼如下所示:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>404</title>
<meta name="renderer" content="webkit">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<style type="text/css">
</style>
</head>
<body>
<link rel="stylesheet" type="text/css" href="/404.css" />
<iframe scrolling='yes' frameborder='0' src='/GY404.html' width='100%' height='100%' style='display:block;'></iframe>
<div class="container">
<div class="btn">
<a href="/" class="goindex">返回首頁(yè)</a><a style="cursor:pointer" onclick="history.back()" class="lx">返回上頁(yè)</a>
<div style="clear:both;"></div>
</div>
</div>
</body>
</html>

最后,就實(shí)現(xiàn)了開(kāi)頭那張圖中的效果,這是可以自適應(yīng)移動(dòng)端的,可以根據(jù)自己的需要進(jìn)行修改和調(diào)整。

==============以下是2019年整的公益頁(yè)面---建議使用上面的=========

測(cè)試URL:http://m.madamerex.com/404

騰訊官方的:https://www.qq.com/404/

公益 404 頁(yè)面介紹

公益404頁(yè)面是由騰訊公司員工志愿者自主發(fā)起的互聯(lián)網(wǎng)公益活動(dòng)。

網(wǎng)站只需要在自己的404頁(yè)面中嵌入一段簡(jiǎn)單的代碼,就能通過(guò)互聯(lián)網(wǎng)來(lái)迅速傳播失蹤兒童信息,從而提高找回失蹤兒童的概率。失蹤兒童信息來(lái)自寶貝回家尋子網(wǎng)。

使用方法:

新建一個(gè)404.htm或者404.html頁(yè)面,直接拷貝以下代碼,丟進(jìn)去保存即可;希望我們都做一個(gè)有溫度的人;

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8;"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="robots" content="all" />
<meta name="robots" content="index,follow"/>
</head>
<body>

<script type="text/javascript" src="https://www.qq.com/404/search_children.js"
charset="utf-8" homePageUrl="http://m.madamerex.com"
homePageName="回到我的主頁(yè)">
</script>

</body>
</html>

問(wèn)題未解決?付費(fèi)解決問(wèn)題加Q或微信 2589053300 (即Q號(hào)又微信號(hào))右上方掃一掃可加博主微信

所寫所說(shuō),是心之所感,思之所悟,行之所得;文當(dāng)無(wú)敷衍,落筆求簡(jiǎn)潔。 以所舍,求所獲;有所依,方所成!

支付寶贊助
微信贊助

免責(zé)聲明,若由于商用引起版權(quán)糾紛,一切責(zé)任均由使用者承擔(dān)。

您必須遵守我們的協(xié)議,如您下載該資源,行為將被視為對(duì)《免責(zé)聲明》全部?jī)?nèi)容的認(rèn)可->聯(lián)系老梁投訴資源
LaoLiang.Net部分資源來(lái)自互聯(lián)網(wǎng)收集,僅供用于學(xué)習(xí)和交流,請(qǐng)勿用于商業(yè)用途。如有侵權(quán)、不妥之處,請(qǐng)聯(lián)系站長(zhǎng)并出示版權(quán)證明以便刪除。 敬請(qǐng)諒解! 侵權(quán)刪帖/違法舉報(bào)/投稿等事物聯(lián)系郵箱:service@laoliang.net
意在交流學(xué)習(xí),歡迎贊賞評(píng)論,如有謬誤,請(qǐng)聯(lián)系指正;轉(zhuǎn)載請(qǐng)注明出處: » 真正騰訊公益 404 頁(yè)面

發(fā)表回復(fù)

本站承接,網(wǎng)站推廣(SEM,SEO);軟件安裝與調(diào)試;服務(wù)器或網(wǎng)絡(luò)推薦及配置;APP開(kāi)發(fā)與維護(hù);網(wǎng)站開(kāi)發(fā)修改及維護(hù); 各財(cái)務(wù)軟件安裝調(diào)試及注冊(cè)服務(wù)(金蝶,用友,管家婆,速達(dá),星宇等);同時(shí)也有客戶管理系統(tǒng),人力資源,超市POS,醫(yī)藥管理等;

立即查看 了解詳情