Jump to content
MakeWebGames

Free Login

Failbro

By Failbro
in Art and Content

 Share

Recommended Posts

Failbro Newbie

Failbro

Posted
Posted (edited)

I was just practicing some html and css skills and whipped this up

 

<!DOCTYPE HTML>
<head>
<title id="title">Failure</title>
<style type="text/css">
#nav
{
position:absolute;
left:0px;
top:0px;
z-index:-1
}
#Login
{
position:absolute;
left:500px;
top:14px;
}
#Body
{
position:absolute;
left:0px;
top:50px;
z-index:-1
}
#home
{
position:absolute;
left:0px;
top:0px;
size: 20px;
color: #FFFFFF;
font-family: Arial, Comic Sans, Veranda;
}
a:link, a:visited, a:active
{
color: #FFFFFF;
text-decoration: none;
}
#bimg
{
position:absolute;
left:0px;
top:50px;
}
#screenshots
{
position:absolute;
left:870px;
top:340px;
border: 4px groove #FFFFFF;
}
#Register:3
{
position:absolute;
left:870px;
top:50px;
border: 4px groove #FFFFFF;
}
</style>
</head>
<body>
<div id="Login"><input type="text" id="username" value="Username" />&nbsp&nbsp<input type="password" id="password" value="Password" /><input type="button" onclick="Login()" value="Login" /></div><div id=Nav></div>
<div id=Body></div>
<p id=home><a href="http://index.php" target="_blank">Home</a>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="http://register.php" target="_blank">Register</a> &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp <a href="http://tos.html" target="_blank">TOS</a></p>
[img=Images/froom.jpg]
<fieldset id="screenshots">[img=Images/screen.png][img=Images/screen.png]

[img=Images/screen.png][img=Images/screen.png]</fieldset>
<fieldset id=Register><legend id=lregister>Register</legend><form action="register.php" method="POST" name="Reg">
Username:

<input type="text" name=username value="Username" />

Password:

<input type="password" name=password />

Confirm Password:

<input type="password" name=cpassword />

Email:

<input type="email" name=email />

Security:

<keygen name="security" />
<input type="submit" value="Register Confirm" />
<input type="button" onclick="document.Reg.reset()" value="Reset" />
</form></fieldset>

<script type="text/javascript">
var scnHei;
var scnWid;

   if (self.innerHeight) // all except Explorer
   {
       scnWid = self.innerWidth;
       scnHei = self.innerHeight;
   }
else if (document.body) // other Explorers
   {
       scnWid = document.body.clientWidth;
       scnHei = document.body.clientHeight;
   }
document.getElementById("Nav").innerHTML = "<canvas id='nav' width='" + scnWid + "'&nbsp height='" + scnHei + "'></canvas>";
var c=document.getElementById("nav");
var nav=c.getContext("2d");
var grd=nav.createLinearGradient(0,0,1500,50);
grd.addColorStop(0,"#000000");
grd.addColorStop(1,"#000000");
nav.fillStyle=grd;
nav.fillRect(0,0,1500,50);
document.getElementById("title").innerHTML = "Your Game Name!";

document.getElementById("Body").innerHTML = "<canvas id='body' width='" + scnWid + "'&nbsp height='" + scnHei + "'></canvas>";
var c=document.getElementById("body");
var body=c.getContext("2d");
var grd1=body.createLinearGradient(0,0,1500,1000);
grd1.addColorStop(0,"#000000");
grd1.addColorStop(1,"#FFFFFF");
body.fillStyle=grd1;
body.fillRect(0,0,1500,1000);
</script>
</body>
</html>
Edited by Failbro
Link to comment
Share on other sites
lucky3809 Newbie

lucky3809

Posted
Posted (edited)

Too many rows of input...

For those wondering what it looks like...

it has a black top-border on top would say 20 px then the main area background is gradient grey,white,black

on top of the black border is the login area in center,

then he added a legend tag for signup guessing the register above and tos and home is suppose to be tabs. but dont come out like tabs do.

and the legend tag looks bad where it's positioned under the login. then to the right under is the screenshot area i guess, the rest is blank lol.\

The coding could be smaller then it is lol.

Edited by lucky3809
Link to comment
Share on other sites
  • 3 weeks later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...