简洁自适应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实现粒子旋转伸缩加载动画
Apr 22 HTML / CSS
CSS3网格的三个新特性详解
Apr 04 HTML / CSS
css3发光搜索表单分享
Apr 11 HTML / CSS
详解CSS3中@media的实际使用
Aug 04 HTML / CSS
HTML5+CSS3实例 :canvas 模拟实现电子彩票刮刮乐代码
Dec 30 HTML / CSS
CSS3 实现雷达扫描图的示例代码
Sep 21 HTML / CSS
HTML5本地存储之Web Storage应用介绍
Jan 06 HTML / CSS
html5指南-1.html5全局属性(html5 global attributes)深入理解
Jan 07 HTML / CSS
详解canvas绘图时遇到的跨域问题
Mar 22 HTML / CSS
AmazeUI 单选框和多选框的实现示例
Aug 18 HTML / CSS
Html5同时支持多端sdk的小技巧
Nov 17 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
使用Xdebug调试和优化PHP程序之[1]
2007/04/17 PHP
PHP中break及continue两个流程控制指令区别分析
2011/04/18 PHP
PHP中如何判断exec函数执行成功?
2016/08/04 PHP
laravel5.6实现数值转换
2019/10/23 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
php 输出缓冲 Output Control用法实例详解
2020/03/03 PHP
关于PHP求解三数之和问题详析
2020/11/09 PHP
Jquery 1.42 checkbox 全选和反选代码
2010/03/27 Javascript
jQuery ajax serialize() 方法使用示例
2014/11/02 Javascript
jQuery通过控制节点实现仅在前台通过get方法完成参数传递
2015/02/02 Javascript
JavaScript自定义等待wait函数实例分析
2015/03/23 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
2017/01/08 Javascript
Vue.js路由vue-router使用方法详解
2017/03/20 Javascript
解决ionic和angular上拉加载的问题
2017/08/03 Javascript
vue-lazyload图片延迟加载插件的实例讲解
2018/02/09 Javascript
微信小程序中插入激励视频广告并获取收益(实例代码)
2019/12/06 Javascript
原生js实现放大镜组件
2021/01/22 Javascript
Windows系统下安装Python的SSH模块教程
2015/02/05 Python
Python中设置变量作为默认值时容易遇到的错误
2015/04/03 Python
Python查询IP地址归属完整代码
2017/06/21 Python
Python随机生成手机号、数字的方法详解
2017/07/21 Python
使用Django启动命令行及执行脚本的方法
2018/05/29 Python
python3使用QQ邮箱发送邮件
2020/05/20 Python
python3.5安装python3-tk详解
2019/04/26 Python
Python多重继承之菱形继承的实例详解
2020/02/12 Python
python实现简单井字棋小游戏
2020/03/05 Python
Lime Crime官网:美国一家主打梦幻精灵系的彩妆品牌
2019/03/22 全球购物
临床医学系毕业生推荐信
2013/11/09 职场文书
外语专业毕业生自荐信
2014/04/14 职场文书
投标邀请书范本
2015/02/02 职场文书
法人身份证明书
2015/06/18 职场文书
排球赛新闻稿
2015/07/17 职场文书
幽默导游词应该怎么写?
2019/08/26 职场文书
两行代码解决Jupyter Notebook中文不能显示的问题
2021/04/24 Python
Vue+Element UI实现概要小弹窗的全过程
2021/05/30 Vue.js
golang为什么要统一错误处理
2022/04/03 Golang