Wednesday, 29 October 2014

Beautiful Design Login Page

Login.jsp


<%@ page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*" errorPage="" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Registration Page</title>
<link  rel="stylesheet" href="style3.css" type="text/css"/>
</head>

<body>
    <div id="body" align="center">
        <h3>Jquery - CSS - Registration</h3>
        <div id="container">
            <div id="login">
                <b>Login Form</b>
                <br />
                <form>
                    User Name : <br /><input type="text" />
                    <br /><br />
                    Password : <br /><input type="password" />
                    <br /><br />
                    <input type="submit" />
                    <br /><br />
                    <button>Don't have Account ? Register Now</button>
                </form>
           
            </div>
        </div>
    </div>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="index.js"></script>
</body>
</html>


Style.css
body{
font-family:tahoma;
font-size:12px;
background:#333;
color:#fff;
}
#body{
margin:100px auto;
width:50%;
}
#container{
width:250px;
}
#login{
background:#fff;
padding:10px;
width:280px;
border-radius:10px;
height:300px;
color:#333;
}
form{
margin:10px;
}
input{
background:#fff;
content:#333;
padding:5px;
font-family:tahoma;
font-size:12px;
border:0px;
box-shadow:0 0 5px #000;
border-radius:5px;
margin:10px;
}
button{
background:#ff4800;
color:#fff;
border-radius:5px;
border:0px;
padding:10px;
font-size:12px;
font-family:tahoma;
}
button:hover{
color:#ff4800;
background:#fff;
cursor:pointer;
}

Output



0 comments:

Post a Comment

Followers