How create beautiful login page using html css and php
Hello friends here i am teach you how to create beautiful cool login page using html css and php
now 1st we use html to make a login table
<html>
<head>
<link rel="stylesheet" href="css/style.css">
<title> a cool place to hang out have a fun </title>
</head>
<body>
<div class="header">
<img src="logo.jpg" alt="logo" id="logo"/>
<p id="headicon">
<a href="index.php">Home </a>
<a href="About.php" >About </a>
<a href="blog.php">Blog </a>
<a href="login.php">Login </a>
<a href="signup.php">Signup </a>
</p>
</div>
<div class="cointener">
<h1 style="color:red"> login page for you </h1>
<form action="index.php" method="post">
//here we use image
<img src="img/img1.jpeg" alt="logo" id="loginimg"/> <br>
username <br>
<input type="username" name="username" id="text" required/> <br>
//what is required ???
/* required is html tag that define the empty text bot. It mean if username and password is empty
then that need to required fields*/
password<br>
<input type="password" name="password" id="text" required/><br>
<input type="submit" name="login" value="login" id="login"/> <br>
<a href="signup.php"> <input type="button" value="Signup" id="submit"/></a>
</form>
</div>
</body>
</html>
now here we write css code
your css code is in side css folder and name is style.css
/*this is stylesheet design by riwash */
.header{
background:#6495ED;
height:60px;
}
#logo{
width:100px;
height:40px;
}
#headicon{
text-align:right;
}
a:link{
color:#6495ED;
text-decoration:none;
}
a:visited{
color:blue;
text-decoration:none;
}
a:hover{
background:hotpink;
color:black;
text-decoration:none;
}
a:active{
background:red;
color:hotpink;
text-decoration:none;
}
.cointener{
width:300px;
height:350px;
text-align:center;
margin-top:50px;
margin-left:300px;
}
#loginimg{
width:200px;
height:190px;
}
#whatis{
margin-top:150px;
color:#6495ED;
}
.error{
color:red;
}
#submit{
color:white;
background:#6495ED;
width:100px;
}
#login{
color:white;
background:green;
width:100px;
}
so this are the html and css script for php and sql script you have to view next post

No comments:
Post a Comment