这是我的新PHP
<?php
/**
* Make sure you started your'e sessions!
* You need to include su.inc.php to make SimpleUsers Work
* After that, create an instance of SimpleUsers and your'e all set!
*/
session_start();
require_once(dirname(__FILE__)."/simpleusers/su.inc.php");
$SimpleUsers = new SimpleUsers();
// Login from post data
if( isset($_POST["username"]) )
{
// Attempt to login the user - if credentials are valid, it returns the users id, otherwise (bool)false.
$res = $SimpleUsers->loginUser($_POST["username"], $_POST["password"]);
if(!$res)
$error = "You supplied the wrong credentials.";
else
{
header("Location: users.php");
exit;
}
} // Validation end
echo '<link href="css/style.css" rel="stylesheet">';
?>
<!doctype html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>CSS3 Button Demo</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<?php if( isset($error) ): ?>
<p>
<?php echo $error; ?>
</p>
<?php endif; ?>
<form method="post" action="">
<input type="username" name="username" id="username" placeholder="Username" />
<input type="password" name="password" id="password" placeholder="Password" />
<input type="submit" name="submit" value="Login" />
</body>
</html>
<?php if( isset($error) ): ?>
<p>
<?php echo $error; ?>
</p>
<?php endif; ?>
<form method="post" action="">
这是我的新CSS:
input[type=password] {
background: url(../img/keyIcon.png) 12px 11px no-repeat, -moz-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url(../img/keyIcon.png) 12px 11px no-repeat, -webkit-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url(../img/keyIcon.png) 12px 11px no-repeat, -o-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url(../img/keyIcon.png) 12px 11px no-repeat, -ms-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url(../img/keyIcon.png) 12px 11px no-repeat, linear-gradient(to bottom, #f7f7f8 0%, #ffffff 100%);
border-radius: 3px;
border: none;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.05) inset;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
font-family: "Helvetica Neue", sans-serif;
font-size: 13px;
color: #222222;
position: relative;
height: 36px;
width: 300px;
padding-left: 30px;
}
input[type=password]::-webkit-input-placeholder {
color: #999999;
}
input[type=password]:-moz-placeholder {
color: #999999;
}
input[type=password]:focus {
box-shadow: 0 1px 0 #2392f3 inset, 0 -1px 0 #2392f3 inset, 1px 0 0 #2392f3 inset, -1px 0 0 #2392f3 inset, 0 0 4px rgba(35, 146, 243, 0.5);
outline: none;
background: url(../img/keyIcon.png) 12px 11px no-repeat, #ffffff;
}
input[type=username] {
background: url() 12px 11px no-repeat, -moz-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url() 12px 11px no-repeat, -webkit-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url() 12px 11px no-repeat, -o-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url() 12px 11px no-repeat, -ms-linear-gradient(top, #f7f7f8 0%, #ffffff 100%);
background: url() 12px 11px no-repeat, linear-gradient(to bottom, #f7f7f8 0%, #ffffff 100%);
border-radius: 3px;
border: none;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.05) inset;
-webkit-transition: all 0.2s linear;
-moz-transition: all 0.2s linear;
-ms-transition: all 0.2s linear;
-o-transition: all 0.2s linear;
transition: all 0.2s linear;
font-family: "Helvetica Neue", sans-serif;
font-size: 13px;
color: #222222;
position: relative;
height: 36px;
width: 300px;
padding-left: 30px;
}
input[type=username]::-webkit-input-placeholder {
color: #999999;
}
input[type=username]:-moz-placeholder {
color: #999999;
}
input[type=username]:focus {
box-shadow: 0 1px 0 #2392f3 inset, 0 -1px 0 #2392f3 inset, 1px 0 0 #2392f3 inset, -1px 0 0 #2392f3 inset, 0 0 4px rgba(35, 146, 243, 0.5);
outline: none;
background: url() 12px 11px no-repeat, #ffffff;
}
输入框(密码,用户名)不是CSS的主题,它们只是默认的。相同的代码(减去PHP)在HTML中运行良好,任何关于导致CSS在PHP中无效的想法?我已经检查了一些其他问题并重新格式化了代码2次。一旦我开始工作,我将如何使用CSS中心登录框?
编辑:现在只有用户名框不是主题 - 检查我所做的更改。
谢谢!
答案 0 :(得分:2)
你的头部元素非常凌乱。将其粘贴到它的位置,让我知道是否可以修复任何内容。
<head>
<title></title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<style type="text/css">
h1
{
color: #000000;
border-bottom: 2px solid #000000;
margin-bottom: 15px;
}
p { margin: 10px 0px; }
p.faded { color: #A0A0A0; }
</style>
</head>
你的标签内部正在调用你的style.css。
答案 1 :(得分:0)
<link rel="stylesheet" type="text/css" href="css/style.css />
您忘记了"
,并且您在css的第一个input
中输了一个拼写错误。
答案 2 :(得分:0)
答案 3 :(得分:0)
<link rel="stylesheet" type="text/css" href="css/style.css" />
<style type="text/css">
h1
{
color: #000000;
border-bottom: 2px solid #000000;
margin-bottom: 15px;
}
p { margin: 10px 0px; }
p.faded { color: #A0A0A0; }
</style>
我认为这样会更好