简洁自适应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 相关文章推荐
CSS去掉A标签(链接)虚线框的方法
Apr 01 HTML / CSS
一款利用纯css3实现的360度翻转按钮的实例教程
Nov 05 HTML / CSS
可自定义箭头样式的CSS3气泡提示框
Mar 16 HTML / CSS
使用 css3 实现圆形进度条的示例
Jul 05 HTML / CSS
详解HTML5表单新增属性
Dec 21 HTML / CSS
HTML5文档结构标签
Apr 21 HTML / CSS
Canvas 文字碰撞检测并抽稀的方法
May 27 HTML / CSS
canvas画布实现手写签名效果的示例代码
Apr 23 HTML / CSS
浅谈three.js中的needsUpdate的应用
Nov 12 HTML / CSS
简单整理HTML5的基本特性和语法
Feb 18 HTML / CSS
html5 canvas绘制网络字体的常用方法
Aug 26 HTML / CSS
什么是css原子化,有什么用?
Apr 24 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.MVC的模板标签系统(五)
2006/09/05 PHP
在线竞拍系统的PHP实现框架(二)
2006/10/09 PHP
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
php实现水仙花数的4个示例分享
2014/04/08 PHP
微信支付开发教程(一)微信支付URL配置
2014/05/28 PHP
PHP实现阳历到农历转换的类实例
2015/03/07 PHP
php arsort 数组降序排序详细介绍
2016/11/17 PHP
用js自动判断浏览器分辨率的代码
2007/01/28 Javascript
javascript call方法使用说明
2010/01/11 Javascript
10个实用的脚本代码工具
2010/05/04 Javascript
js弹窗返回值详解(window.open方式)
2014/01/11 Javascript
VS2008中使用JavaScript调用WebServices
2014/12/18 Javascript
jQuery取消ajax请求的方法
2015/06/09 Javascript
D3.js进阶系列之CSV表格文件的读取详解
2017/06/06 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
Angular中管道操作符(|)的使用方法
2017/12/15 Javascript
p5.js入门教程之小球动画示例代码
2018/03/15 Javascript
vue项目中vue-i18n和element-ui国际化开发实现过程
2018/04/25 Javascript
JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
2018/06/01 Javascript
vue click.stop阻止点击事件继续传播的方法
2018/09/04 Javascript
vue实现父子组件之间的通信以及兄弟组件的通信功能示例
2019/01/29 Javascript
微信小程序云开发详细教程
2019/05/16 Javascript
微信小程序如何自定义table组件
2019/06/29 Javascript
Websocket 向指定用户发消息的方法
2020/01/09 Javascript
基于vue中的scoped坑点解说
2020/09/04 Javascript
[01:05:30]VP vs TNC 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Python selenium如何设置等待时间
2016/09/15 Python
django 创建过滤器的实例详解
2017/08/14 Python
利用 python 对目录下的文件进行过滤删除
2017/12/27 Python
python学习入门细节知识点
2018/03/29 Python
对python requests发送json格式数据的实例详解
2018/12/19 Python
阿里云ECS服务器部署django的方法
2019/08/29 Python
如何唤起类中的一个方法
2013/11/29 面试题
网络工程师的自我评价
2013/10/02 职场文书
中专生毕业自我鉴定
2013/11/01 职场文书
2015新教师教学工作总结
2015/07/22 职场文书