<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>留言板注册练习</title>

    <script type="text/javascript" src="./js/jquery-3.5.1.min.js"></script>

    <script type="text/javascript" src="./js/bootstrap.min.js"></script>

    <link rel="stylesheet" type="text/css" href="./js/bootstrap.min.css">

</head>

<body class="container">

<nav class="navbar navbar-default">

  <div class="container-fluid">

    <!-- Brand and toggle get grouped for better mobile display -->

    <div class="navbar-header">

      <a class="navbar-brand" href="#">留言板</a>

    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->

    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

      <ul class="nav navbar-nav">

        <li class="active"><a href="#">我要留言<span class="sr-only">(current)</span></a></li>

      </ul>

      <form class="navbar-form navbar-right">

        <div class="form-group">

          <input type="text" class="form-control" placeholder="Search">

        </div>

        <button type="submit" class="btn btn-default">搜留言</button>

      </form>

    </div><!-- /.navbar-collapse -->

  </div><!-- /.container-fluid -->

</nav>

<div class="row">

  <div class="col-md-4"></div>

  <div class="col-md-4">

      <legend class="text-center">用户注册</legend>

    <form>

  <div class="form-group">

    <label for="exampleInputEmail1">用户名</label>

    <input type="text" class="form-control" id="exampleInputEmail1" placeholder="Username">

  </div>

  <div class="form-group">

    <label for="exampleInputPassword1">密码</label>

    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">

  </div>

  <div class="form-group">

    <label for="exampleInputPassword1">确认密码</label>

    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">

  </div>

  <button type="submit" class="btn btn-primary">注册</button>

</form>

  </div>

  <div class="col-md-4"></div>

</div>

<nav class="navbar navbar-default navbar-fixed-bottom">

  <div class="container">

    版权所有@张千禧

  </div>

</nav>

</body>

</html>

Bootstrap留言板界面练习的更多相关文章

  1. nodejs中利用expresss脚手架和bootstrap,数据库mongodb搭建的留言板案例

    ## 1. 先打开编辑器,创建一个项目 ## 2. 再打开cmd命令提示符下载express脚手架 express   项目名   --view=ejs 或express   -e    项目名 ## ...

  2. 【weiphp微信开发教程】留言板插件开发详解

    基于weiphp框架的留言板插件教程: 1.功能分析 传统的留言板应该具有发布留言.查看留言.回复留言.管理留言等功能,本教程开发的是最基本的留言板,仅包含发布留言和查看留言两个功能,根据功能用boo ...

  3. flask实战-留言板-Web程序开发流程

    Web程序开发流程 在实际的开发中,一个Web程序的开发过程要设计多个角色,比如客户(提出需求).项目经理(决定需求的实现方式).开发者(实现需求)等,在这里我们假设自己是一个人全职开发.一般来说一个 ...

  4. 使用PHP连接数据库实现留言板功能

    PHP实现留言板功能: 1 首先是登录页面: <!DOCTYPE html><html>    <head>        <meta charset=&qu ...

  5. 数据库留言板例题：session和cookie区别

    session和cookie区别: <?php session_start(); //session_start();必须写在所有的php代码前边 ?> <!DOCTYPE html ...

  6. ajax练习四留言板

    留言界面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3 ...

  7. Web开发从零单排之二：在自制电子请帖中添加留言板功能,SAE+PHP+MySql

    在上一篇博客中介绍怎样在SAE平台搭建一个html5的电子请帖网站,收到很多反馈,也有很多人送上婚礼的祝福,十分感谢! web开发从零学起,记录自己学习过程,各种前端大神们可以绕道不要围观啦 大婚将至 ...

  8. jsp 用application对象制作留言板

    <%@ page contentType="text/html; charset=gb2312"%> <html> <body> <for ...

  9. [js高手之路] vue系列教程 - 实现留言板todolist(3)

    通过前面两篇文章的的学习,我们掌握了vue的基本用法. 本文,就利用这些基础知识来实现一个留言板, 老外把他称之为todolist. 第一步.使用bootstrap做好布局 <!DOCTYPE ...

随机推荐

  1. Mac磁盘清理工具——CleanMyMac

    许多刚从Windows系统转向Mac系统怀抱的用户,一开始难免不习惯,因为Mac系统没有像Windows一样的C盘.D盘,分盘分区明显.因此这也带来了一些问题,关于Mac的磁盘的清理问题,怎么进行清理 ...

  2. 从维基百科等网站复制公式到MathType中

    在写论文的时候你会想要一些比书本上更好的实例,所以你会在网上寻找资源.当你发现一个你想要的公式时,发现网页公式复制粘贴后太模糊而不适合打印或者投影.这种问题在MathType中如何解决呢? 你可以将网 ...

  3. 蓝桥杯——字母阵列(2018JavaC组第3题)

    字母阵列(18JavaC3) 标题:字母阵列 仔细寻找,会发现:在下面的8x8的方阵中,隐藏着字母序列:"LANQIAO". SLANQIAO ZOEXCCGB MOAYWKHI ...

  4. 【对不起】我并不是真的会用spring

    19年12月4日,为了测试另外一个部门的服务在注册到这边zk后能否拿到dubbo代理,在controller草草写了一个http服务请求之,发现所有的dubbo接口都没有被注入代理,排查许久之后,发现 ...

  5. WireShark抓包分析以及对TCP/IP三次握手与四次挥手的分析

    WireShark抓包分析TCP/IP三次握手与四次挥手 Wireshark介绍: Wireshark(前称Ethereal)是一个网络封包分析软件.功能十分强大,是一个可以在多个操作系统平台上的开源 ...

  6. IdentityServer4系列 | 客户端凭证模式

    一.前言 从上一篇关于 快速搭建简易项目中,通过手动或者官方模板的方式简易的实现了我们的IdentityServer授权服务器搭建,并做了相应的配置和UI配置,实现了获取Token方式. 而其中我们也 ...

  7. moviepy音视频剪辑：使用fl_time进行时间特效处理报错OSError: Error in file xxxx, Accessing time

    ☞ ░ 前往老猿Python博文目录 ░ 老猿在使用moviepy音视频剪辑的fl_time进行时间特效处理时,系统报错: OSError: Error in file F:\video\WinBas ...

  8. 第三十章、containers容器类部件QMdiArea多文档界面部件功能介绍及开发应用

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 一.引言 老猿在前期学习PyQt相关知识时,对每个组件的属性及方法都研 ...

  9. PyQt(Python+Qt)学习随笔：Qt Designer中部件mimimumSize和maximumSize的含义

    1.mimimumSize mimimumSize表示部件能被缩小到的最小尺寸,单位为像素,缩小到该尺寸后不能再进一步缩小了.如果部件在布局管理器中,且布局管理器也设置了最小尺寸,则部件本身的最小尺寸 ...

  10. MapReduce简单执行过程及Wordcount案例

    MapReducer运行过程 以单词统计为案例. 假如现在文件中存在如下内容: aa bb aa cc dd aa 当然,这是小文件,如果文件大小较大时会将文件进行 "切片" ,此 ...