2023-07-26 19:33:39 +02:00

184 lines
4.3 KiB
HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en">
<head>
<title>Relic</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="top">
<h1>Relic</h1>
</div>
<div id="wrapper">
<!-- LEFT COLUMN -->
<div id="left">
<h1>Left column</h1>
<p> You could use this column as some sort of
news box, link list, or a second navigation. It would also
be quite feasable to move this to the right and have the
navigation here.</p>
<h1>Custom designs</h1>
<p>Schools out, and I don't have too much on the go right now,
so if you want a custom design made, give me a shout, and I'll
make you a template for a very fair price.
</p>
<h1>About the Author</h1>
<p>My name is Kevin Cannon. I live just outside of Vancouver,
Canada. I've been dabbling in web design for a while, and this is
my fourth template submitted to OSWD. Most of my work, no wait ...
<b>all</b> of my work has been done for free so far. Maybe I will do
web design for a living, but probably not.</p>
</div>
<!-- MIDDLE COLUMN -->
<div id="middle">
<h1>Relic</h1>
<p>Welcome to Relic, my most ambitious template yet.
This is a fluid, 3-column design. No matter which column is tallest, the design
will not fail, and the footer will always stay at the bottom of the page. The columns
have widths based in percentages, so the template will smoothly transfer to different
screen resolutions. This is all achieved through pure Css, no javascript at all. Sorry for all that
tech-talk, its really much simpler than it sounds</p>
<h1>Simplicity</h1>
<p>Because of the use of CSS and Xhtml in place of tables, you will find
this template incredibly easy to modify. To help you out even more, the
Css and Xhtml is clearly labeled with comments throughout.</p>
<h1>The design</h1>
<p> Its July, so I chose a light summer
colour scheme with greens and blues. The header is off of the stock x-change,
and is not included in the zip file, otherwise it would be over 100kb. Instead
I've hosted it externally. You will probably want to use your own header,
but if you really like this one it can be found <a href="http://img240.echo.cx/img240/4435/header2vv.gif">here</a>. If you need
any help at all with this template, don't hesitate to contact me through OSWD,
or email - kmcannon [at] telus [dot] net.</p>
<h1>Images</h1>
<a href="http://www.mozilla.org/products/firefox/central.html">
<img class="left" src="fox.gif" alt="firefox" height="90" width="95"></img></a>
<p>This template is very image-friendly, and through the use of classes,
you can have your images floating in either side of the text. The images are controlled
externally with CSS.
You can also have images as links, like the firefox logo in the corner.
And, again through CSS, you can have mouseover effects. If you're using
firefox, put your cursor over the logo. But for some reason IE doesn't like
image rollover effects. Its not that big of a deal.</p>
</div>
<!-- RIGHT COLUMN -->
<div id="right">
<h1>In the News</h1>
<a href="#">Deep impact smashes comet</a>
<a href="#">3 Florida shark attacks in a week</a>
<a href="#">Mad Cow originated in Texas</a>
<a href="#">G8 summit in Scotland</a>
<h1>Latest posts</h1>
<a href="#">Relic</a> - 07/04/05<br />
<a href="#">Simplicity</a> - 07/03/05<br />
<a href="#">The Design</a> - 07/02/05<br />
<a href="#">Images</a> - 07/01/05<br />
<h1>Search the Archives</h1>
<input class="text" type="text" name="search" />
<input class="go" type="submit" value="Go" />
</div>
<!--DO NOT ERASE THE NEXT PART-->
</div>
<!-- FOOTER -->
<div id="footer">
<p class="footer">
<a href="#">Xhtml Valid</a> |
<a href="#">CSS Valid</a> |
&copy; 2005 your name
<br />
Design by Kevin Cannon<br />
<!--This theme is free for distriubtion, so long as link to openwebdesing.org and florida-villa.com stay on the theme-->
Courtesy <a href="http://www.openwebdesign.org" target="_blank">Open Web Design</a><a href="http://www.dubaiapartments.biz" target="_blank"><img src="spacer.gif" width="5" height="5" border="0"/></a> Thanks
to <a href="http://www.florida-villa.com" target="_blank">Florida Vacation Homes</a></p>
</div>
</body>
</html>