简洁自适应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图片边框border-image的用法
Jun 30 HTML / CSS
CSS3 background-image颜色渐变的实现代码
Sep 13 HTML / CSS
CSS3实现滚动条动画效果代码分享
Aug 03 HTML / CSS
CSS3点击按钮实现背景渐变动画效果
Oct 19 HTML / CSS
css3实现背景模糊的三种方式(小结)
May 15 HTML / CSS
纯CSS3实现的井字棋游戏
Nov 25 HTML / CSS
免费获得微软MCSD证书赶快行动吧!
Nov 13 HTML / CSS
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
Jan 31 HTML / CSS
详解HTML5 data-* 自定义属性
Jan 24 HTML / CSS
canvas绘制太极图的实现示例
Apr 29 HTML / CSS
用position:sticky完美解决小程序吸顶问题的实现方法
Apr 24 HTML / CSS
详解CSS不受控制的position fixed
May 25 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
php下把数组保存为文件格式的实例应用
2010/02/08 PHP
探讨:array2xml和xml2array以及xml与array的互相转化
2013/06/24 PHP
PHP基于堆栈实现的高级计算器功能示例
2017/09/15 PHP
Jquery知识点二 jquery下对数组的操作
2011/01/15 Javascript
jQuery中.live()方法的用法深入解析
2013/12/30 Javascript
js取float型小数点后两位数的方法
2014/01/18 Javascript
深入分析JSON编码格式提交表单数据
2015/06/25 Javascript
最简单纯JavaScript实现Tab标签页切换的方式(推荐)
2016/07/25 Javascript
关于微信中a链接无法跳转问题
2016/08/02 Javascript
使用JavaScript获取URL中的参数(两种方法)
2016/11/16 Javascript
jQuery 如何实现一个滑动按钮开关
2016/12/01 Javascript
Bootstrap响应式导航由768px变成992px的实现代码
2017/06/15 Javascript
基于casperjs和resemble.js实现一个像素对比服务详解
2018/01/10 Javascript
5 种JavaScript编码规范
2018/01/30 Javascript
Nodejs实现爬虫抓取数据实例解析
2018/07/05 NodeJs
JS实现方形抽奖效果
2018/08/27 Javascript
解决angularjs WdatePicker ng-model的问题
2018/09/13 Javascript
React降级配置及Ant Design配置详解
2018/12/27 Javascript
react组件从搭建脚手架到在npm发布的步骤实现
2019/01/09 Javascript
vue2 v-model/v-text 中使用过滤器的方法示例
2019/05/09 Javascript
微信小程序实现pdf、word等格式文件上传的方法
2019/09/10 Javascript
js如何验证密码强度
2020/03/18 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
jQuery实现二级导航菜单的示例
2020/09/30 jQuery
工作中常用js功能汇总
2020/11/07 Javascript
Python的Django框架中设置日期和字段可选的方法
2015/07/17 Python
深入解析Python中的线程同步方法
2016/06/14 Python
python可视化篇之流式数据监控的实现
2019/08/07 Python
Django使用 Bootstrap 样式修改书籍列表过程解析
2019/08/09 Python
浅析数据存储的三种方式 cookie sessionstorage localstorage 的异同
2020/06/04 HTML / CSS
酒店服务实习自我鉴定
2013/09/22 职场文书
房地产销售经理岗位职责
2014/01/01 职场文书
党员个人年度总结
2015/02/14 职场文书
婚姻出轨保证书
2015/05/08 职场文书
2015年小学体育教师工作总结
2015/10/23 职场文书
eclipse创建项目没有dynamic web的解决方法
2021/06/24 Java/Android