idyllic
<!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" xml:lang="en" >
<head>
<title>Idyllic</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style type="text/css" media="all">
@import "idyllic.css";
</style>
</head>
<body>
<div id="page">
<div id="header">
<h1 id="sitetitle">idyllic</h1>
<h1 id="pagetitle">page title</h1>
<h2 id="pagedesc">page description, subtitle, or author information</h2>
</div>
<!-- end header--->
<div id="rightcol">
<h2>Menu</h2>
<ul>
<li><a href="http://www.free-css.com/">Home</a></li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
</ul>
<h2>Categories</h2>
<ul>
<li>Non-linked Menu Item</li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
</ul>
<h2>Links</h2>
<ul>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
<li><a href="http://www.free-css.com/">Menu Item</a></li>
</ul>
</div>
<!-- end right column -->
<div id="content">
<h1>Heading Level 1</h1>
<p><strong>Idyllic:</strong> an open-source web Design that attempts to bring forth the beauty of nature as captured by a fine artist. Visit n-vent.com and drop me a line of thanks. Enjoy!</p>
<p>Lorem ipsum dolor sit <a href="http://www.free-css.com/">amet</a>, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<h2>Heading Level 2</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<blockquote><strong>This is a blockquote</strong>. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</blockquote>
<ul>
<li>unordered list</li>
<li>unordered list</li>
<li>unordered list</li>
</ul>
<h3>Heading Level 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<ol>
<li>ordered list</li>
<li>ordered list</li>
<li>ordered list</li>
</ol>
<h4>Heading Level 4</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<div id="footer"> © 2007 Your Company or Blog. | Site Design by <a href="http://www.n-vent.com">N-vent.com</a> </div>
<!-- end footer -->
</div>
<!-- end content -->
<div id="leftcol"><img src="idyllic-images/leftside.jpg" alt="" /></div>
<!-- sidebar -->
</div>
<!-- end page -->
</body>
</html>
Related examples in the same category