简洁自适应404页面HTML好看的404源码


Posted in HTML / CSS onDecember 16, 2020

演示图如下:

简洁自适应404页面HTML好看的404源码

HTML代码片段:

<!DOCTYPE HTML>
<html>
    <head>
        <title>404</title>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
        <link rel="stylesheet" href="assets/css/main.css" />
        <!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
        <noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
    </head>
    <body>

        <!-- Wrapper -->
            <div id="wrapper">

                <!-- Header -->
                    <header id="header">
                        <div class="logo">
                            <span class="icon fa-diamond"></span>
                        </div>
                        <div class="content">
                            <div class="inner">
                                <h1>404</h1>
                                <p><!--[-->对不起,你要找的这个页面突然不见了。不过,放心,一切都在我的掌控之中,不会跑多远!<!--]--></p>
                            </div>
                        </div>
                        <nav>
                            <ul>
                                <li><a href="###">首页</a></li>
                                <li><a href="###">热搜</a></li>
                                <li><a href="###">联系</a></li>
                                <li><a href="###">关于</a></li>
                                <!--<li><a href="#elements">Elements</a></li>-->
                            </ul>
                        </nav>
                    </header>

                <!-- Main -->


                <!-- Footer -->
                    <footer id="footer">
                        <p class="copyright">© Untitled. Design: <a href="http://www.baidu.com">百度</a>.</p>
                    </footer>

            </div>

        <!-- BG -->
            <div id="bg"></div>

        <!-- Scripts -->
            <script src="assets/js/jquery.min.js"></script>
            <script src="assets/js/skel.min.js"></script>
            <script src="assets/js/util.js"></script>
            <script src="assets/js/main.js"></script>

    </body>
</html>

图片&css代码部分:

链接: https://pan.baidu.com/s/18NcQScW6GKshXBKwHabTnA 提取码: rgaw

到此这篇关于简洁自适应404页面HTML好看的404源码的文章就介绍到这了,更多相关404页面源码内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

HTML / CSS 相关文章推荐
CSS3 实现时间轴动画
Nov 25 HTML / CSS
HTML5实现分享到微信好友朋友圈QQ好友QQ空间微博二维码功能
Jan 03 HTML / CSS
html通过canvas转成base64的方法
Jul 18 HTML / CSS
socket.io 和canvas 实现的共享画板功能
May 22 HTML / CSS
Html5无刷新修改browser Url的方法
Jan 15 HTML / CSS
HTML5实现WebSocket协议原理浅析
Jul 07 HTML / CSS
基于HTML5+Webkit实现树叶飘落动画
Dec 28 HTML / CSS
快速实现一个简单的canvas迷宫游戏的示例
Jul 04 HTML / CSS
html5移动端价格输入键盘的实现
Sep 16 HTML / CSS
Html5之自定义属性(data-,dataset)
Nov 19 HTML / CSS
css背景和边框标签实例详解
May 21 HTML / CSS
postman中form-data、x-www-form-urlencoded、raw、binary的区别介绍
Jan 18 HTML / CSS
移动端HTML5开发神器之vconsole详解
Dec 15 #HTML / CSS
如何查看浏览器对html5的支持情况
Dec 15 #HTML / CSS
如何使用canvas绘制可移动网格的示例代码
Dec 14 #HTML / CSS
HTML5 body设置全屏背景图片的示例代码
Dec 08 #HTML / CSS
Html5基于canvas实现电子签名并生成PDF文档
Dec 07 #HTML / CSS
HTML5基于flash实现播放RTMP协议视频的示例代码
Dec 04 #HTML / CSS
前端水印的简单实现代码示例
Dec 02 #HTML / CSS
You might like
Zend引擎的发展 [15]
2006/10/09 PHP
深入phpMyAdmin的安装与配置的详细步骤
2013/05/07 PHP
解析php中的escape函数
2013/06/29 PHP
yii框架表单模型使用及以数组形式提交表单数据示例
2014/04/30 PHP
PHP利用curl发送HTTP请求的实例代码
2020/07/09 PHP
javascript 对象比较实现代码
2009/04/27 Javascript
ExtJs的Date格式字符代码
2010/12/30 Javascript
JavaScript中instanceof运算符的用法总结
2013/11/19 Javascript
JavaScript使用encodeURI()和decodeURI()获取字符串值的方法
2015/08/04 Javascript
深入理解vue.js双向绑定的实现原理
2016/12/05 Javascript
谈谈Vue.js——vue-resource全攻略
2017/01/16 Javascript
新手vue构建单页面应用实例代码
2017/09/18 Javascript
JS处理一些简单计算题
2018/02/24 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
2019/09/28 Javascript
VUE页面中通过双击实现复制表格中内容的示例代码
2020/06/11 Javascript
Python 正则表达式操作指南
2009/05/04 Python
Python psutil模块简单使用实例
2015/04/28 Python
python实现逻辑回归的方法示例
2017/05/02 Python
Python操作MongoDB详解及实例
2017/05/18 Python
Python多项式回归的实现方法
2019/03/11 Python
python aiohttp的使用详解
2019/06/20 Python
Pytorch之卷积层的使用详解
2019/12/31 Python
HTML5跳转小程序wx-open-launch-weapp的示例代码
2020/07/16 HTML / CSS
生物专业个人自荐信范文
2013/11/29 职场文书
《那片绿绿的爬山虎》教学反思
2014/02/27 职场文书
优秀食品类广告词
2014/03/19 职场文书
文明村镇申报材料
2014/05/06 职场文书
我的中国梦演讲稿300字
2014/08/19 职场文书
2014最新毕业证代领委托书
2014/09/26 职场文书
酒店辞职信怎么写
2015/02/27 职场文书
2014年度个人总结范文
2015/03/09 职场文书
高中同学会致辞
2015/08/01 职场文书
青年志愿者活动感想
2015/08/07 职场文书
2019个人工作态度自我评价
2019/04/24 职场文书
PyQt5 QThread倒计时功能的实现代码
2021/04/02 Python
Python 多线程处理任务实例
2021/11/07 Python