php bootstrap实现简单登录

5年以前  |  阅读数:1209 次  |  编程语言:PHP 

本文实例为大家分享了php bootstrap实现简单登录的方法,供大家参考,具体内容如下

这里写图片描述

这里写图片描述

这里写图片描述

所有文件

这里写图片描述

记住是获取name键值对 from 里面 action就是你的动作

signin.html


    <!DOCTYPE html>
    <html lang="en">
     <head>
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
     <meta name="description" content="">
     <meta name="author" content="">
     <link rel="icon" href="../../favicon.ico">

     <title>Signin Template for Bootstrap</title>

     <!-- Bootstrap core CSS -->
     <link href="bootstrap.min.css" rel="stylesheet">

     <!-- Custom styles for this template -->
     <link href="signin.css" rel="stylesheet">

     <!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
     <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
     <script src="../../assets/js/ie-emulation-modes-warning.js"></script>

     <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
     <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
     <![endif]-->
     </head>

     <body>

     <div class="container">

      <form class="form-signin" method = "get" action = "form-signin.php">
      <h2 class="form-signin-heading">Please sign in</h2>
      <label for="inputEmail" class="sr-only">Email address</label>
      <input type="email" id="inputEmail" name ="inputEmail"class="form-control" placeholder="Email address" required autofocus>
      <label for="inputPassword" class="sr-only">Password</label>
      <input type="password" id="inputPassword"name ="inputPassword" class="form-control" placeholder="Password" required>
      <div class="checkbox">
       <label>
       <input type="checkbox" value="remember-me" name="remember me"> Remember me
       </label>
      </div>
      <button class="btn btn-lg btn-primary btn-block" type="submit">Sign in</button>
      </form>

     </div> <!-- /container -->


     <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
     <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
     </body>
    </html>

sign.css


    body {
     padding-top: 40px;
     padding-bottom: 40px;
     background-color: #eee;
    }

    .form-signin {
     max-width: 330px;
     padding: 15px;
     margin: 0 auto;
    }
    .form-signin .form-signin-heading,
    .form-signin .checkbox {
     margin-bottom: 10px;
    }
    .form-signin .checkbox {
     font-weight: normal;
    }
    .form-signin .form-control {
     position: relative;
     height: auto;
     -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
       box-sizing: border-box;
     padding: 10px;
     font-size: 16px;
    }
    .form-signin .form-control:focus {
     z-index: 2;
    }
    .form-signin input[type="email"] {
     margin-bottom: -1px;
     border-bottom-right-radius: 0;
     border-bottom-left-radius: 0;
    }
    .form-signin input[type="password"] {
     margin-bottom: 10px;
     border-top-left-radius: 0;
     border-top-right-radius: 0;
    }

form-signin.php


    <pre>
    <?php print_r($_GET);?>
    </pre>

如果大家还想深入学习,可以点击这里进行学习,再为大家附两个精彩的专题:Bootstrap学习教程 Bootstrap实战教程

以上就是本文的全部内容,希望对大家的学习有所帮助

 相关文章:
PHP分页显示制作详细讲解
SSH 登录失败:Host key verification failed
将二进制数据转为16进制以便显示
获取IMSI
获取IMEI
Java生成UUID
PHP自定义函数获取搜索引擎来源关键字的方法
让你成为最历害的git提交人
在Zeus Web Server中安装PHP语言支持
再谈PHP中单双引号的区别详解
指定应用ID以获取对应的应用名称
Python 2与Python 3版本和编码的对比
php+ajax+json 详解及实例代码
Yii2汉字转拼音类的实例代码
php封装的page分页类完整实例
php数组合并array_merge()函数使用注意事项
PHP实现简单爬虫的方法
PHP设计模式之工厂模式与单例模式
php实现数组中索引关联数据转换成json对象的方法
wget使用技巧