I'm creating a site with HTML and CSS. I want to have a dummy log in for with minimal functionality integrated at the corner of a page, when a username and password is use it should say "wrong password"!

I'd replace it with a real log-in later. Right now I am just making the site as a proof of concept and don't want to get into too much of complexity as I am not a programer and know only HTML and CSS.

It might be a really simple thing to do but I have not been able to开发者_运维百科 find any suitable solutions from net in last few months. :(

Could anyone help ?

You are going to need a server-side language to handle the credentials. While you can run a simple validation with HTML5 on the email (or username) field, you are going to need a server-side language such as PHP in order to handle those credentials. You might also want to encrypt the passwords to make your login system more secure, using something like md5($password);.

Example

HTML Form

<div id="main" role="main"> 
<form method="post" action="#" > 
<fieldset> 
    <label for="username">Username <span class="ico"><img src="img/user.png" alt="Username Icon" border="0" /></span></label> 
    <input type="text" name="username" id="username" required autofocus> 
    <label for="password">Password <span class="ico"><img src="img/pass.png" alt="Password Icon" border="0" /></span></label>  
    <input type="password" name="password" id="password" required>
</fieldset> 
<fieldset> 
    <span class="password"><a href="#">Forgot Password</a></span> 
    <button type=submit>>>&nbsp;&nbsp;&nbsp;GO</button> 
</fieldset> 
</form> 
</div>

SQL Members Table

CREATE TABLE `members` (
`id` int(4) NOT NULL auto_increment,
`username` varchar(65) NOT NULL default '',
`password` varchar(65) NOT NULL default '',
PRIMARY KEY (`id`)
) TYPE=MyISAM AUTO_INCREMENT=2 ;

-- 
-- Dumping data for table `members`
--

INSERT INTO `members` VALUES (1, 'john', '1234');

PHP Login Check

<?php
$host="localhost"; // Host name 
$username=""; // Mysql username 
$password=""; // Mysql password 
$db_name="test"; // Database name 
$tbl_name="members"; // Table name

// Connect to server and select databse.
mysql_connect("$host", "$username", "$password")or die("cannot connect"); 
mysql_select_db("$db_name")or die("cannot select DB");

// username and password sent from form 
$myusername=$_POST['myusername']; 
$mypassword=$_POST['mypassword'];

// To protect MySQL injection (more detail about MySQL injection)
$myusername = stripslashes($myusername);
$mypassword = stripslashes($mypassword);
$myusername = mysql_real_escape_string($myusername);
$mypassword = mysql_real_escape_string($mypassword);

$sql="SELECT * FROM $tbl_name WHERE username='$myusername' and password='$mypassword'";
$result=mysql_query($sql);

// Mysql_num_row is counting table row
$count=mysql_num_rows($result);
// If result matched $myusername and $mypassword, table row must be 1 row

if($count==1){
// Register $myusername, $mypassword and redirect to file "login_success.php"
session_register("myusername");
session_register("mypassword"); 
header("location:login_success.php");
}
else {
echo "Wrong Username or Password";
}
?>

PHP Login Successful

<? 
session_start();
if(!session_is_registered(myusername)){
header("location:main_login.php");
}
?>

<html>
<body>
Login Successful
</body>
</html>

PHP Logout

<? 
session_start();
session_destroy();
?>

Well, jtbandes pretty much said it already: a dynamic language needs to check the validity of the login and, certainly with login details, due to security reasons, you want to use server-side code, like PHP or ASP.

Having said that, it really seems pointless to make a dummy login, other than just building the HTML code. Unless you use AJAX to send the data to your web-server, rather than forwarding the user to a processing page, any and all code you put in for a 'dummy' will be a waste of time and will need to be removed later.

How will the page look different after login as it does before and what will cause this difference? An additional GET in the URL?

JavaScript is the best choice for you. very very unsafe since people can view JavaScript code in "View Source". Or you can always use server side language. You can't do any thing dynamic with HTML and CSS only.