404页面(Bootstrap)

来源：互联网发布：sql语句创建视图编辑：程序博客网时间：2024/05/23 14:08

这里写图片描述

说明：
btn btn-primary 使得按钮更加好看，btn-danger是红颜色的
form-control 使得输入框变得更加好看
form-inline 使得form-group元素变成行内元素
m-t 增加行间距

按钮可以用button标签，也可以用a标签，如下

<a href="index.html" class="btn btn-primary m-t">主页</a>

<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    <title>404页面</title>    <link href="css/bootstrap.min.css" rel="stylesheet">    <link href="css/font-awesome.min.css" rel="stylesheet" >    <link href="css/animate.min.css" rel="stylesheet">    <link href="css/style.min.css" rel="stylesheet">    <base target="_self"></head><body ><div class="middle-box text-center animated fadeInDown" >    <h1>404</h1>    <h3 > 页面未能够找到！! !</h3>    <div >        抱歉，页面好像去火星啦！        <form class="form-inline m-t" role="form">            <div class="form-group">                <input type="email"  class="form-control" placeholder="请输入你需要查找的内容..." />            </div>            <button type="submit" class=" btn btn-primary">搜索</button>        </form>    </div></div><script src="js/jquery.min.js" ></script><script src="js/bootstrap.min.js"></script><script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script></body></html>

FR:徐海涛（Hunk Xu) QQ技术群：386476712

1 0