About Web Design Book Chapter 7 - Example 7-5
Here is the code for example 7-5 in the About Web Design book.
The Page | The HTML | The Stylesheet
The HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Contact Dogs and Their Toys</title>
<meta name="description" content="Send your question to the Dogs and Their Toys team." />
<meta name="keywords" content="dogs, dog toys, canines, information about dogs, dog help, contact us" />
<link type="text/css" href="zexample7-5.css" rel="stylesheet" />
</head>
<body>
<div id="subcol"></div>
<div id="maincol">
<h1>Dogs and Their Toys</h1>
<h2>Contact Us</h2>
<form action="mailto:webdesign.guide@about.com" method="get" enctype="text/plain">
<label accesskey="n" for="name">Name:
<input type="text" name="name" id="name" value="" size="40" /></label><br />
<label accesskey="e" for="email">Email:
<input type="text" name="email" id="email" value="" size="40" /></label><br />
Do you want a reply?
<label accesskey="y"><input type="radio" name="reply" id="reply" value="yes" /> Yes</label>
<label accesskey="n"><input type="radio" name="reply" id="reply" value="no" /> No</label><br />
What is your message?<br />
<textarea name="message" id="message" rows="10" cols="35"></textarea><br />
<input type="submit" value="Send Message" />
<input type="reset" value="Clear Form" />
</form>
</div>
</body>
</html>
Replace the title and meta tags with your own site content.
The Stylesheet (CSS)
html, body { margin: 0px; }
html { background-color : #fff; }
body {
font: normal 1em Geneva, Arial, Helvetica;
}
Here's what the page looks like.
Jennifer Kyrnin
