|
Registration Form Tutorial
Part 3: Header Script
|
Copy
the following script into another blank document in a text editor,
Netscape Composer, Dreamweaver, etc. and save the script as header.html.
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
|
<!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>Elliott
Smith Fan Club</title>
<style type="text/css">
body {
margin:0px 0px 0px 0px;
background: #9F9;
}
#leftcontent {
float:left;
width:67%;
background:#fff;
border-right:2px solid #000;
border-bottom:2px solid #000;
margin-right:15px;
padding-bottom:20px;
}
p,h1,pre {
margin:0px 30px 10px 30px;
}
h1 {
font-size:14px;
padding-top:10px;
}
#rightcontent p {
font-size:14px;
margin-left:0px;
}
</style>
</head>
<body>
<!-- BEGIN CHANGEABLE CONTENT. -->
<!-- Script 8.2 - header.html -->
|
Script Explanation:
The script primarily contains the Cascading Style
Sheet (CSS) information and the beginning html for a web page.
More information about CSS can be obtained at W3
Schools.
Modifications:
Delete:
Lines 16-22
Change the information in the following lines:
Line 6: change Elliott
Smith Fan Club to (your
site name)
Add
the following:
background-color:
#663366; at the body section; this will change the color
of the background
font-size:18px;
and margin-left:0px; in
#leftcontent section;
body,td,th {
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
} before </style>
Copy all h1 information and paste above #rightcontent section
In pasted area, change h1 to h2
change font-size
to 16px and padding-top to
10px
Save the script.
Now, create a new table which will divide the navigation and screen
content.
Copy the following and paste it at the bottom of this script.
Change the information in the header to reflect the name of your site.
<table
style="width: 100%; text-align: left;" border="1"
cellpadding="6"
cellspacing="2">
<tbody>
<tr align="center">
<td colspan="2" rowspan="1"
style="vertical-align: top;"><span
style="font-weight:
bold;">
<h1>DA Secret Society of
DaZone<br>
</h1>
</span></td>
</tr>
<tr>
<td style="width: 20%;
vertical-align: top;">
<h1>Navigation</h1>
<a
href="index.php">Home</a><br>
<a
href="login.php">Login</a><br>
<a
href="register.php">Register</a><br>
<br>
<h2>(Temporary
Navigation)</h2>
</span></div> <a href="create_db.php">Create
Database</a><br>
<a
href="create_table.php">Create
Table</a><br>
<a
href="view_members.php">View Database
Entries</a><br>
<a
href="edit_entry.php">Edit Database
Entries</a><br>
<a
href="delete_entry.php">Delete Database
Entries</a>
</td><td>
Save the script.
|
|