html+css+php+mysql实现注册+注销+登陆后才能访问页面加密源码（附完整代码）
最近有一个项目需要实现会员注册和页面登陆后才能访问，所以这个简单的HTML是无法实现的，就必须通过PHP、html和Mysql来实现，先给大家看一下登录和注册页的效果图。（注册完成后会自动跳转到登录窗口，即使A用户登陆后分享了网址，B用户也必须要先登陆后才能浏览）
程序是100%可以运营跑通的，下面我直接附上源码（CSS为非核心代码，代码比较长，你也可以自行修改。如果想完全复用我的，也可以私我）：
如果完全复用代码，需要在mysql中新建数据库（aaaaa）,密码为aaaaa，数据中新建表dlcs，表中有username、password。
一、登录源码
HTML前端登录样式
login.html文件
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>焰遐云会员管理系统平台</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/util.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100">
<div class="login100-form-title" style="background-image: url(images/bg-01.jpg);">
<span class="login100-form-title-1">会员登录</span>
</div>
<form class="login100-form validate-form" action="login.php" method="post">
<div class="wrap-input100 validate-input m-b-26" data-validate="用户名不能为空">
<span class="label-input100">账号</span>
<input class="input100" type="text" name="username" placeholder="请输入账号">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-18" data-validate="密码不能为空">
<span class="label-input100">密码</span>
<input class="input100" type="password" name="password" placeholder="请输入密码">
<span class="focus-input100"></span>
</div>
<div class="flex-sb-m w-full p-b-30">
<div class="contact100-form-checkbox">
<input class="input-checkbox100" id="ckb1" type="checkbox" name="remember-me">
<label class="label-checkbox100" for="ckb1" type="checkbox" name="remember" value="yes">7天内自动登录</label>
</div>
<div>
<a href="javascript:" class="txt1">没有账号？立即注册</a>
</div>
</div>
<div class="container-login100-form-btn">
<input class="login100-form-btn" type="submit" name="login" value="提交">
</div>
</form>
</div>
</div>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/main.js"></script>
<style>
.copyrights{
text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
</style>
</body>
</html>
login.php文件
<?php
// 告知浏览器我们是html，解码用utf-8，header()表示向客户端发送一个原始的http包头
header('Content-type:text/html; charset=utf-8');
// 开启Session，返回一个bool值
// Session表示存储关于用户会话（session）的信息
session_start();
// 处理用户登录信息
// $_POST[]的变量应该是请求的html页面中，通过‘name’被复制的变量
if (isset($_POST['login'])) {
# 接受用户的登录消息，trim去掉字符串中的空格
$username = trim($_POST['username']);
$password = trim($_POST['password']);
// 判断提交的登录信息
if (($username == '') || ($password == '')) {
// 若为空，视为未填写，提示错误，并3秒后返回登录界面
header('refresh:3; url=login.html');
echo "用户名或密码不能为空，系统将在3秒后跳转到登录界面，请重新填写登录信息！";
exit;
}
// 连接数据库
$link = mysqli_connect('127.0.0.1','aaaaa','lixiang123456','aaaaa');
// 验证数据库的连接状态
$query=mysqli_query($link,"SELECT username,password FROM dlcs WHERE username = '$username'");
$row = mysqli_fetch_array($query);
if (!$row) {
header('refresh:3; url=login.html');
echo "用户名或密码错误，系统将在3秒后跳转到登录界面，请重新填写登录信息！";
exit;
} else {
# 用户名和密码都正确，将用户信息存储到Session中
$_SESSION['username'] = $username;
$_SESSION['islogin'] = 1;
// 若勾选7天内自动登录,则将其保存到Cookie并设置保留7天
if ($_POST['remember'] == "yes") {
setcookie('username', $username, time()+7*24*60*60);
setcookie('code', md5($username.md5($password)), time()+7*24*60*60);
} else {
// 没有勾选则删除Cookie
setcookie('username', '', time()-999);
setcookie('code', '', time()-999);
}
// 处理完附加项后跳转到登录成功的首页
header('location:weizhuang.php');
}
}
?>
HTML前端注册样式
zhuce.html文件
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>焰遐云会员管理后台</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="fonts/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="css/util.css">
<link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
<div class="limiter">
<div class="container-login100">
<div class="wrap-login100">
<div class="login100-form-title" style="background-image: url(images/bg-01.jpg);">
<span class="login100-form-title-1">会员管理系统</span>
</div>
<form class="login100-form validate-form" action="zhuce.php" method="get">
<div class="wrap-input100 validate-input m-b-26" data-validate="用户名不能为空">
<span class="label-input100">账号</span>
<input class="input100" type="text" name="username" placeholder="请输入账号">
<span class="focus-input100"></span>
</div>
<div class="wrap-input100 validate-input m-b-18" data-validate="密码不能为空">
<span class="label-input100">密码</span>
<input class="input100" type="password" name="password" placeholder="请输入密码">
<span class="focus-input100"></span>
</div>
<div class="container-login100-form-btn">
<input class="login100-form-btn" type="submit" name="zhuce" value="立即注册">
</div>
</form>
</div>
</div>
</div>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/main.js"></script>
<style>
.copyrights{
text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
</style>
</body>
</html>
zhuce.php文件
<meta charset="UTF-8">
<?php
$username = 'aaaaa';
$password = 'lixiang123456';
$ip = '127.0.0.1';
$database = 'aaaaa';
$conn = new mysqli($ip,$username,$password,$database);
$logname = $_GET['username'];
$password = $_GET['password'];
$sql = "select * from dlcs where username = '$logname';";
$res = mysqli_query($conn,$sql);
if($res->num_rows > 0){
echo '用户已存在,3秒后跳转,请重新输入。';
header('Refresh:3,houtai.html');
}else{
$sql = "insert into dlcs value('$logname','$password');";
if(mysqli_query($conn,$sql)){
echo'注册成功,3秒后返回登录页面。';
header('Refresh:3,login.html');
}else{
echo'注册失败。';
}
}
?>
前端注销样式
logout.php文件
<?php
header('Content-type:text/html; charset=utf-8');
// 注销后的操作
session_start();
// 清除Session
$username = $_SESSION['username']; //用于后面的提示信息
$_SESSION = array();
session_destroy();
// 清除Cookie
setcookie('username', '', time()-99);
setcookie('code', '', time()-99);
// 提示信息
echo "欢迎下次光临, ".$username.'<br>';
echo "<a href='login.html'>重新登录</a>";
?>
必须登陆后才能访问：
在需要登陆后才能访问的页面增加该文件即可：
<?php
header('Content-type:text/html; charset=utf-8');
// 开启Session
session_start();
// 首先判断Cookie是否有记住了用户信息
if (isset($_COOKIE['username'])) {
# 若记住了用户信息,则直接传给Session
$_SESSION['username'] = $_COOKIE['username'];
$_SESSION['islogin'] = 1;
}
if (isset($_SESSION['islogin'])){
} else exit("<script language='javascript'>window.location.href='./login.html';</script>");
?>
CSS样式（在主目录下新建css文件夹，将css文件放在里边）
main.css
/****************************************************************
* *
* *
* *
* 努力创建完善、持续更新插件以及模板 *
* *
****************************************************************/
/* input[type="password"] {
color: transparent;
} */
/*//
[ RESTYLE TAG ]*/
* {
margin: 0px;
padding: 0px;
box-sizing: border-box;
}
body,
html {
height: 100%;
font-family: Poppins-Regular, sans-serif;
}
/*---------------------------------------------*/
a {
font-family: Poppins-Regular;
font-size: 14px;
line-height: 1.7;
color: #666666;
margin: 0px;
transition: all 0.4s;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
-moz-transition: all 0.4s;
}
a:focus {
outline: none !important;
}
a:hover {
text-decoration: none;
color: #57b846;
}
/*---------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0px;
}
p {
font-family: Poppins-Regular;
font-size: 14px;
line-height: 1.7;
color: #666666;
margin: 0px;
}
ul,
li {
margin: 0px;
list-style-type: none;
}
/*---------------------------------------------*/
input {
outline: none;
border: none;
}
input[type="number"] {
-moz-appearance: textfield;
appearance: none;
-webkit-appearance: none;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
-webkit-appearance: none;
}
textarea {
outline: none;
border: none;
}
textarea:focus,
input:focus {
border-color: transparent !important;
}
input:focus::-webkit-input-placeholder {
color: transparent;
}
input:focus:-moz-placeholder {
color: transparent;
}
input:focus::-moz-placeholder {
color: transparent;
}
input:focus:-ms-input-placeholder {
color: transparent;
}
textarea:focus::-webkit-input-placeholder {
color: transparent;
}
textarea:focus:-moz-placeholder {
color: transparent;
}
textarea:focus::-moz-placeholder {
color: transparent;
}
textarea:focus:-ms-input-placeholder {
color: transparent;
}
input::-webkit-input-placeholder {
color: #999999;
}
input:-moz-placeholder {
color: #999999;
}
input::-moz-placeholder {
color: #999999;
}
input:-ms-input-placeholder {
color: #999999;
}
textarea::-webkit-input-placeholder {
color: #999999;
}
textarea:-moz-placeholder {
color: #999999;
}
textarea::-moz-placeholder {
color: #999999;
}
textarea:-ms-input-placeholder {
color: #999999;
}
label {
display: block;
margin: 0;
}
/*---------------------------------------------*/
button {
outline: none !important;
border: none;
background: transparent;
}
button:hover {
cursor: pointer;
}
iframe {
border: none !important;
}
/*//
[ Utility ]*/
.txt1 {
font-family: Poppins-Regular;
font-size: 13px;
line-height: 1.4;
color: #999999;
}
/*//
[ login ]*/
.limiter {
width: 100%;
margin: 0 auto;
}
.container-login100 {
width: 100%;
min-height: 100vh;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
padding: 15px;
background: #ebeeef;
}
.wrap-login100 {
width: 670px;
background: #fff;
border-radius: 10px;
overflow: hidden;
position: relative;
}
/*==================================================================
[ Title form ]*/
.login100-form-title {
width: 100%;
position: relative;
z-index: 1;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
flex-direction: column;
align-items: center;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
padding: 70px 15px 74px 15px;
}
.login100-form-title-1 {
font-family: Poppins-Bold;
font-size: 30px;
color: #fff;
text-transform: uppercase;
line-height: 1.2;
text-align: center;
}
.login100-form-title::before {
content: "";
display: block;
position: absolute;
z-index: -1;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: rgba(54, 84, 99, 0.7);
}
/*==================================================================
[ Form ]*/
.login100-form {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 43px 88px 93px 190px;
}
/*------------------------------------------------------------------
[ Input ]*/
.wrap-input100 {
width: 100%;
position: relative;
border-bottom: 1px solid #b2b2b2;
}
.label-input100 {
font-family: Poppins-Regular;
font-size: 15px;
color: #808080;
line-height: 1.2;
text-align: right;
position: absolute;
top: 14px;
left: -105px;
width: 80px;
}
/*---------------------------------------------*/
.input100 {
font-family: Poppins-Regular;
font-size: 15px;
color: #555555;
line-height: 1.2;
display: block;
width: 100%;
background: transparent;
padding: 0 5px;
}
.focus-input100 {
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
pointer-events: none;
}
.focus-input100::before {
content: "";
display: block;
position: absolute;
bottom: -1px;
left: 0;
width: 0;
height: 1px;
-webkit-transition: all 0.6s;
-o-transition: all 0.6s;
-moz-transition: all 0.6s;
transition: all 0.6s;
background: #57b846;
}
/*---------------------------------------------*/
input.input100 {
height: 45px;
}
.input100:focus+.focus-input100::before {
width: 100%;
}
.has-val.input100+.focus-input100::before {
width: 100%;
}
/*==================================================================
[ Restyle Checkbox ]*/
.input-checkbox100 {
display: none;
}
.label-checkbox100 {
font-family: Poppins-Regular;
font-size: 13px;
color: #999999;
line-height: 1.4;
display: block;
position: relative;
padding-left: 26px;
cursor: pointer;
}
.label-checkbox100::before {
content: "\f00c";
font-family: FontAwesome;
font-size: 13px;
color: transparent;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
width: 18px;
height: 18px;
border-radius: 2px;
background: #fff;
border: 1px solid #e6e6e6;
left: 0;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.input-checkbox100:checked+.label-checkbox100::before {
color: #57b846;
}
/*------------------------------------------------------------------
[ Button ]*/
.container-login100-form-btn {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
}
.login100-form-btn {
width: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
padding: 0 20px;
min-width: 160px;
height: 50px;
background-color: #57b846;
border-radius: 25px;
font-family: Poppins-Regular;
font-size: 16px;
color: #fff;
line-height: 1.2;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
-moz-transition: all 0.4s;
transition: all 0.4s;
}
.login100-form-btn:hover {
background-color: #333333;
}
/*------------------------------------------------------------------
[ Responsive ]*/
@media (max-width: 576px) {
.login100-form {
padding: 43px 15px 57px 117px;
}
}
@media (max-width: 480px) {
.login100-form {
padding: 43px 15px 57px 15px;
}
.label-input100 {
text-align: left;
position: unset;
top: unset;
left: unset;
width: 100%;
padding: 0 5px;
}
}
/*------------------------------------------------------------------
[ Alert validate ]*/
.validate-input {
position: relative;
}
.alert-validate::before {
content: attr(data-validate);
position: absolute;
max-width: 70%;
background-color: #fff;
border: 1px solid #c80000;
border-radius: 2px;
padding: 4px 25px 4px 10px;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
right: 2px;
pointer-events: none;
font-family: Poppins-Medium;
color: #c80000;
font-size: 13px;
line-height: 1.4;
text-align: left;
visibility: hidden;
opacity: 0;
-webkit-transition: opacity 0.4s;
-o-transition: opacity 0.4s;
-moz-transition: opacity 0.4s;
transition: opacity 0.4s;
}
.alert-validate::after {
content: "\f06a";
font-family: FontAwesome;
display: block;
position: absolute;
color: #c80000;
font-size: 15px;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
right: 8px;
}
.alert-validate:hover:before {
visibility: visible;
opacity: 1;
}
@media (max-width: 992px) {
.alert-validate::before {
visibility: visible;
opacity: 1;
}
}
util.css
/****************************************************************
* *
* *
* *
* 努力创建完善、持续更新插件以及模板 *
* *
****************************************************************/
/*[ FONT SIZE ]
///
*/
.fs-1 {
font-size: 1px;
}
.fs-2 {
font-size: 2px;
}
.fs-3 {
font-size: 3px;
}
.fs-4 {
font-size: 4px;
}
.fs-5 {
font-size: 5px;
}
.fs-6 {
font-size: 6px;
}
.fs-7 {
font-size: 7px;
}
.fs-8 {
font-size: 8px;
}
.fs-9 {
font-size: 9px;
}
.fs-10 {
font-size: 10px;
}
.fs-11 {
font-size: 11px;
}
.fs-12 {
font-size: 12px;
}
.fs-13 {
font-size: 13px;
}
.fs-14 {
font-size: 14px;
}
.fs-15 {
font-size: 15px;
}
.fs-16 {
font-size: 16px;
}
.fs-17 {
font-size: 17px;
}
.fs-18 {
font-size: 18px;
}
.fs-19 {
font-size: 19px;
}
.fs-20 {
font-size: 20px;
}
.fs-21 {
font-size: 21px;
}
.fs-22 {
font-size: 22px;
}
.fs-23 {
font-size: 23px;
}
.fs-24 {
font-size: 24px;
}
.fs-25 {
font-size: 25px;
}
.fs-26 {
font-size: 26px;
}
.fs-27 {
font-size: 27px;
}
.fs-28 {
font-size: 28px;
}
.fs-29 {
font-size: 29px;
}
.fs-30 {
font-size: 30px;
}
.fs-31 {
font-size: 31px;
}
.fs-32 {
font-size: 32px;
}
.fs-33 {
font-size: 33px;
}
.fs-34 {
font-size: 34px;
}
.fs-35 {
font-size: 35px;
}
.fs-36 {
font-size: 36px;
}
.fs-37 {
font-size: 37px;
}
.fs-38 {
font-size: 38px;
}
.fs-39 {
font-size: 39px;
}
.fs-40 {
font-size: 40px;
}
.fs-41 {
font-size: 41px;
}
.fs-42 {
font-size: 42px;
}
.fs-43 {
font-size: 43px;
}
.fs-44 {
font-size: 44px;
}
.fs-45 {
font-size: 45px;
}
.fs-46 {
font-size: 46px;
}
.fs-47 {
font-size: 47px;
}
.fs-48 {
font-size: 48px;
}
.fs-49 {
font-size: 49px;
}
.fs-50 {
font-size: 50px;
}
.fs-51 {
font-size: 51px;
}
.fs-52 {
font-size: 52px;
}
.fs-53 {
font-size: 53px;
}
.fs-54 {
font-size: 54px;
}
.fs-55 {
font-size: 55px;
}
.fs-56 {
font-size: 56px;
}
.fs-57 {
font-size: 57px;
}
.fs-58 {
font-size: 58px;
}
.fs-59 {
font-size: 59px;
}
.fs-60 {
font-size: 60px;
}
.fs-61 {
font-size: 61px;
}
.fs-62 {
font-size: 62px;
}
.fs-63 {
font-size: 63px;
}
.fs-64 {
font-size: 64px;
}
.fs-65 {
font-size: 65px;
}
.fs-66 {
font-size: 66px;
}
.fs-67 {
font-size: 67px;
}
.fs-68 {
font-size: 68px;
}
.fs-69 {
font-size: 69px;
}
.fs-70 {
font-size: 70px;
}
.fs-71 {
font-size: 71px;
}
.fs-72 {
font-size: 72px;
}
.fs-73 {
font-size: 73px;
}
.fs-74 {
font-size: 74px;
}
.fs-75 {
font-size: 75px;
}
.fs-76 {
font-size: 76px;
}
.fs-77 {
font-size: 77px;
}
.fs-78 {
font-size: 78px;
}
.fs-79 {
font-size: 79px;
}
.fs-80 {
font-size: 80px;
}
.fs-81 {
font-size: 81px;
}
.fs-82 {
font-size: 82px;
}
.fs-83 {
font-size: 83px;
}
.fs-84 {
font-size: 84px;
}
.fs-85 {
font-size: 85px;
}
.fs-86 {
font-size: 86px;
}
.fs-87 {
font-size: 87px;
}
.fs-88 {
font-size: 88px;
}
.fs-89 {
font-size: 89px;
}
.fs-90 {
font-size: 90px;
}
.fs-91 {
font-size: 91px;
}
.fs-92 {
font-size: 92px;
}
.fs-93 {
font-size: 93px;
}
.fs-94 {
font-size: 94px;
}
.fs-95 {
font-size: 95px;
}
.fs-96 {
font-size: 96px;
}
.fs-97 {
font-size: 97px;
}
.fs-98 {
font-size: 98px;
}
.fs-99 {
font-size: 99px;
}
.fs-100 {
font-size: 100px;
}
.fs-101 {
font-size: 101px;
}
.fs-102 {
font-size: 102px;
}
.fs-103 {
font-size: 103px;
}
.fs-104 {
font-size: 104px;
}
.fs-105 {
font-size: 105px;
}
.fs-106 {
font-size: 106px;
}
.fs-107 {
font-size: 107px;
}
.fs-108 {
font-size: 108px;
}
.fs-109 {
font-size: 109px;
}
.fs-110 {
font-size: 110px;
}
.fs-111 {
font-size: 111px;
}
.fs-112 {
font-size: 112px;
}
.fs-113 {
font-size: 113px;
}
.fs-114 {
font-size: 114px;
}
.fs-115 {
font-size: 115px;
}
.fs-116 {
font-size: 116px;
}
.fs-117 {
font-size: 117px;
}
.fs-118 {
font-size: 118px;
}
.fs-119 {
font-size: 119px;
}
.fs-120 {
font-size: 120px;
}
.fs-121 {
font-size: 121px;
}
.fs-122 {
font-size: 122px;
}
.fs-123 {
font-size: 123px;
}
.fs-124 {
font-size: 124px;
}
.fs-125 {
font-size: 125px;
}
.fs-126 {
font-size: 126px;
}
.fs-127 {
font-size: 127px;
}
.fs-128 {
font-size: 128px;
}
.fs-129 {
font-size: 129px;
}
.fs-130 {
font-size: 130px;
}
.fs-131 {
font-size: 131px;
}
.fs-132 {
font-size: 132px;
}
.fs-133 {
font-size: 133px;
}
.fs-134 {
font-size: 134px;
}
.fs-135 {
font-size: 135px;
}
.fs-136 {
font-size: 136px;
}
.fs-137 {
font-size: 137px;
}
.fs-138 {
font-size: 138px;
}
.fs-139 {
font-size: 139px;
}
.fs-140 {
font-size: 140px;
}
.fs-141 {
font-size: 141px;
}
.fs-142 {
font-size: 142px;
}
.fs-143 {
font-size: 143px;
}
.fs-144 {
font-size: 144px;
}
.fs-145 {
font-size: 145px;
}
.fs-146 {
font-size: 146px;
}
.fs-147 {
font-size: 147px;
}
.fs-148 {
font-size: 148px;
}
.fs-149 {
font-size: 149px;
}
.fs-150 {
font-size: 150px;
}
.fs-151 {
font-size: 151px;
}
.fs-152 {
font-size: 152px;
}
.fs-153 {
font-size: 153px;
}
.fs-154 {
font-size: 154px;
}
.fs-155 {
font-size: 155px;
}
.fs-156 {
font-size: 156px;
}
.fs-157 {
font-size: 157px;
}
.fs-158 {
font-size: 158px;
}
.fs-159 {
font-size: 159px;
}
.fs-160 {
font-size: 160px;
}
.fs-161 {
font-size: 161px;
}
.fs-162 {
font-size: 162px;
}
.fs-163 {
font-size: 163px;
}
.fs-164 {
font-size: 164px;
}
.fs-165 {
font-size: 165px;
}
.fs-166 {
font-size: 166px;
}
.fs-167 {
font-size: 167px;
}
.fs-168 {
font-size: 168px;
}
.fs-169 {
font-size: 169px;
}
.fs-170 {
font-size: 170px;
}
.fs-171 {
font-size: 171px;
}
.fs-172 {
font-size: 172px;
}
.fs-173 {
font-size: 173px;
}
.fs-174 {
font-size: 174px;
}
.fs-175 {
font-size: 175px;
}
.fs-176 {
font-size: 176px;
}
.fs-177 {
font-size: 177px;
}
.fs-178 {
font-size: 178px;
}
.fs-179 {
font-size: 179px;
}
.fs-180 {
font-size: 180px;
}
.fs-181 {
font-size: 181px;
}
.fs-182 {
font-size: 182px;
}
.fs-183 {
font-size: 183px;
}
.fs-184 {
font-size: 184px;
}
.fs-185 {
font-size: 185px;
}
.fs-186 {
font-size: 186px;
}
.fs-187 {
font-size: 187px;
}
.fs-188 {
font-size: 188px;
}
.fs-189 {
font-size: 189px;
}
.fs-190 {
font-size: 190px;
}
.fs-191 {
font-size: 191px;
}
.fs-192 {
font-size: 192px;
}
.fs-193 {
font-size: 193px;
}
.fs-194 {
font-size: 194px;
}
.fs-195 {
font-size: 195px;
}
.fs-196 {
font-size: 196px;
}
.fs-197 {
font-size: 197px;
}
.fs-198 {
font-size: 198px;
}
.fs-199 {
font-size: 199px;
}
.fs-200 {
font-size
上一篇： 网页设计练习-Jav
下一篇： PHP获取URL后缀