404页面(Bootstrap)

最新推荐文章于 2024-06-04 07:36:26 发布

海涛高软

最新推荐文章于 2024-06-04 07:36:26 发布

阅读量9.2k

点赞数 1

分类专栏： Bootstrap

本文链接：https://blog.csdn.net/qq_15267341/article/details/53908419

版权

Bootstrap 专栏收录该内容

60 篇文章 2 订阅

订阅专栏

这里写图片描述

说明：
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
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
404页面(Bootstrap)

说明： btn btn-primary 使得按钮更加好看，btn-danger是红颜色的 form-control 使得输入框变得更加好看 form-inline 使得form-group元素变成行内元素 m-t 增加行间距<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name
复制链接

扫一扫