开发一个简单网站--第一章:初遇

最新推荐文章于 2023-04-10 22:17:52 发布

一个平凡de人

最新推荐文章于 2023-04-10 22:17:52 发布

阅读量588

点赞数

分类专栏： web开发文章标签： web html javascript php mysql

本文链接：https://blog.csdn.net/weixin_46703850/article/details/109206725

版权

这篇博客介绍了如何利用PHP、MySQL、HTML、CSS、JavaScript和Bootstrap框架开发一个简单的网站。主要内容包括登录和注册页面的实现，以及后台验证和数据库配置。登录页面的CSS效果和验证码功能分别来自相关教程链接。

摘要由CSDN通过智能技术生成

笫一章:初遇

介绍:利用PHP、Mysql数据库、html、css、javascript、bootstrap框架,开发一个简单网站.效率不高,主要作练习用.

<1>.登录页面 loginto.php

效果图:
在这里插入图片描述

引用：css效果用的是:

https://blog.csdn.net/Wrj6811/article/details/105800712?utm_medium=distribute.wap_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.wap_blog_relevant_no_pic&depth_1-utm_source=distribute.wap_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.wap_blog_relevant_no_pic

引用：验证码用的是:

https://www.jianshu.com/p/7473f5bdd9c0

loginto.php文件代码：

<!DOCTYPE html>
<html lang="en">
 
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="PNG/loginto.css" rel="stylesheet" media="screen">
    <link href="bootstrap-3.0.0/dist/css/bootstrap.min.css" rel="stylesheet" media="screen">
    <meta charset="utf-8">
    <meta name="description" content="Example of Fluid Layout with Bootstrap version 2.0 from w3cschool.cc">
    <meta name="author" content="">
    <!-- Le styles -->
    <link href="bootstrap-3.0.0/dist/bootstrap/twitter-bootstrap-v2/docs/assets/css/bootstrap.css" rel="stylesheet">
    <link href="bootstrap-3.0.0/dist/bootstrap/twitter-bootstrap-v2/docs/assets/css/example-fluid-layout.css" rel="stylesheet">

    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1786038_m62pqneyrzf.css">
    <title>龙星通信-登录</title>
    <style src="into/custom.css"></style>
</head>
 
<body >
    <div id="fb-root"></div>
    <script type="text/javascript">
        (function(d, s, id) {
   
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s); js.id = id;
            js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));   
    </script>


    <div class="form-wrapper">
        
        <div class="header">
            登录
        </div>

        <form method="post" action="https://www.test.com/NB/self/login.php" >
            <div class="input-wrapper">
                <div class="border-wrapper">
                    <input type="text" name="account" placeholder="帐户" class="border-item" autocomplete="off">
                </div>
                <div class="border-wrapper">
                    <input type="password" name="password" placeholder="密码" class="border-item" autocomplete="off">
                </div>
                <div class="border-wrapper">
                    <input type="password" name="verification" placeholder="验证码" class="border-item" autocomplete="off">
                </div>