The general catalog of the strong project series is in 000 episodes
How to learn PHP – [Knowledge scope of mind map]
Article directory
-
- This series of school motto
- Technology used in this project
- Upper renderings
- phpStudy settings
-
- import database
- The project directory is shown in the figure:
-
- page code
- code behind
- Can such an ugly interface be tolerated?
- supporting resources
- Operation:
This series of school motto
Use the free public video to fly to the training class! If you are beaten to death, you will not report to work, and you will make money by working hard!
As long as you have a computer, you can do front and rear projects! N years of studying hard and no one asked, once you become famous, the world knows it!
Technology used in this project
PHP classless | PHP class writing | ThinkPHP framework | Other frameworks |
---|---|---|---|
* |
PHP version | mysql version | running tool | editing tool |
---|---|---|---|
5.4.45 + Apache | 5.5 (phpStudy comes with it) | phpStudy2018 | HBuilderX3.8.7 |
Up effect map
Basically, as long as you see the website (more than 90%), there will be login, and if you don’t log in, you will have no user information. Login has basically become a necessary module for Bishi, and some people even spend money on the effect of login. a lot of time
So how important is a beautiful login (login) interface, the word login (login) has a long history, and some people even officially say that login is more formal than login, but both words have been used all the time.
phpStudy Settings
Website directory, there can be no Chinese or spaces, just obediently use variable names that can be recognized by C language
Import database
Open mysql-front or navicat
Note: Database name: myblog Super user: root Password: 123456
Just run this example attachment. The screenshot of the successful import of the database is as follows:
The project directory is shown in the figure:
page code
<form action="./login.php" method="post"> <fieldset style="width:200px"> <legend>login form</legend> <input type="text" name="username" placeholder="username" required/><br/> <input type="password" name="password" placeholder="password" required/><br/> <input type="submit" name="login" value="login"/> <input type="reset" name="reset" value="reset"/> </fieldset> </form>
There is no error in this, and the browser can display it.
Background code
login.php
<?php include_once(__DIR__ . "/functions/dbcon.php"); if(empty($_POST) || !isset($_POST["login"])){<!-- --> exit("You must go through the login form, you cannot use GET requests to directly access this program."); } $sql = "select * from users where username=? and password=?"; $check = [$_POST['username'], (($_POST['password']))]; $pdo = get_pdo(); $pstmt = $pdo->prepare($sql); $pstmt->execute($check); if($user = $pstmt->fetch(PDO::FETCH_ASSOC)){<!-- --> echo "Successful login<br/>"; echo "Username: {$user['username']}, is it a blogger: {$user['blogger']}"; } else {<!-- --> echo "Login failed"; } ?>
The dbcon.php that connects to the database is used in it
dbcon.php
<?php function get_pdo(){<!-- --> $servername = "localhost"; $dbname = "myblog"; $username = "root"; $password = "123456"; $pdo = new PDO("mysql:host=$servername;dbname=$dbname;port=3306;charset=utf8mb4", $username, $password); return $pdo; } ?>
Well, a simple login is done.
Can such an ugly interface be tolerated?
Beautiful front-end interface code.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Login interface</title> <link rel="stylesheet" href="css/index.css"> <script type="text/javascript" src="js/jquery.js"></script> </head> <body> <script> $(document).ready(function () {<!-- --> var whei = $(window). width() $("html").css({<!-- --> fontSize: whei / 24 }); $(window).resize(function () {<!-- --> var whei = $(window). width(); $("html").css({<!-- --> fontSize: whei / 24 }) }); }); </script> <div class="main"> <div class="header"> <div class="header-center fl"> <div class="header-title"> login interface </div> <div class="header-img"></div> </div> <div class="header-bottom fl"></div> </div> <div class="content"> <div class="content-left"> <!--<img src="images/d.png" alt="">--> </div> <div class="content-right"> <form action="./login.php" method="post"> <div class="right-infp"> <div class="right-infp-name"> <input type="text" name="username" placeholder="Please enter username" maxlength="12" required="" value="" autocomplete="off "> </div> <div class="right-infp-name"> <input type="text" name="password" placeholder="Please enter the password" autocomplete="off"> </div> <div class="right-infp-btn"> <button class="btn" type="submit">Login</button> </div> </div> </form> </div> </div> </div> </body> </html>
At this moment, the mood is calm, and the rendering finally appears.
Provide two other beautiful interfaces for logging in/recording.
All example usernames and passwords are admin:admin
The database is the same.
Example 2. Change the password to type=”password”
just for show
Example 3 (Only the login function is OK)
Example 4:
Example 5: Dynamic and cool big data interface – cool to have no friends – big homework, a must for complete design
The verification code is fake, the picture is fixed, and the input can also be entered randomly. It is from Mongolians. hey-hey
You can also adjust the color tone, and the animation in the interface is still displayed normally (partial display)
Because there are too many grids on this page, CSDN will always recognize it as a QR code.
Supporting resources
This example login interface:
https://download.csdn.net/download/dearmite/88079251
Example 2 interface:
https://download.csdn.net/download/dearmite/88079253
Example 3 interface:
https://download.csdn.net/download/dearmite/88079264
Example 4 interface:
https://download.csdn.net/download/dearmite/88079266
Example 5 interface:
https://download.csdn.net/download/dearmite/88079267
Assignment:
recite:
Brother Biao’s classic quotation: Others say that I look like fog, rain, and wind, but I don’t look like a human