Skip to content

Instantly share code, notes, and snippets.

@chriscauley

chriscauley/demo.html

Created October 10, 2012 15:14
Show Gist options
  • Save chriscauley/3866273 to your computer and use it in GitHub Desktop.
Save chriscauley/3866273 to your computer and use it in GitHub Desktop.
Download ZIP
demo html file for intro so html
Raw
demo.html
<html xmlns="http://www.w3.org/1999/xhtml"><head><meta charset="UTF-8">
<title>WaterColored Portfolio | A free CSS Template | made in PV.M Garage</title>
<meta name="description" content="Watercolored is a free css template released under Creative Common License by PV.M Garage">
<meta name="keywords" content="watercolored, web, design, xhtml, css, photoshop">
<meta name="author" content="Piervincenzo Madeo">
<meta name="keywords" content="watercolored, web, design, xhtml, css, photoshop">
<meta name="author" content="Piervincenzo Madeo">
<link href="http://www.pvmgarage.com/downloads/watercolored_portfolio/style.css" rel="stylesheet" type="text/css">
<style type="text/css"></style>
<meta name="chromesniffer" id="chromesniffer_meta" content="{&quot;jQuery&quot;:&quot;1.3.2&quot;,&quot;jQuery UI&quot;:&quot;1.7.2&quot;}"></head>
<body>
<div id="main_container" class="clear">
<div id="left_container">
<div id="logo">
<a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#" class="logo_link"></a>
</div>
<div id="menu">
<ul>
<li><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">home</a></li>
<li><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">about</a></li>
<li><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">blog</a></li>
<li><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">services</a></li>
<li><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">projects</a></li>
</ul>
</div>
<div id="featured" class="ui-tabs ui-widget ui-widget-content ui-corner-all">
<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
<li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#featured-1">1</a></li>
<li class="ui-state-default ui-corner-top"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#featured-2">2</a></li>
<li class="ui-state-default ui-corner-top"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#featured-3">3</a></li>
<li class="ui-state-default ui-corner-top"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#featured-4">4</a></li>
</ul>
<div id="featured-1" class="featured_content ui-tabs-panel ui-widget-content ui-corner-bottom">
<h1>PV.M Garage blogzine - www.pvmgarage.com</h1>
<div class="feat_left">
<ol>
<li>PhotoShop and Logo Design</li>
<li>Web Layout <strong>(X)HTML/CSS</strong></li>
<li><strong>WordPress</strong> Theme</li>
<li>Web Writing and <strong>Advertise</strong></li>
<li>Search Engine Optimization</li>
<li><strong>Google Adsense</strong> to Monetize</li>
</ol>
<ol class="menu_cont">
<li><span class="ico1">2009.06</span></li>
<li><span class="ico2"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">comments</a></span></li>
<li><span class="ico3"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Tweet!</a></span></li>
</ol>
</div>
<div class="image_cont">
<a href="http://www.pvmgarage.com/"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/pvm.jpg" alt="pvm"></a>
</div>
</div>
<div id="featured-2" class="featured_content ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
<h1>Sport News Pvm - www.sportnewspvm.net</h1>
<div class="feat_left">
<ol>
<li>PhotoShop and Logo Design</li>
<li><strong>WordPress</strong> Theme</li>
<li>Articles for <strong>On-Line Magazine</strong></li>
<li>Search Engine Optimization</li>
<li><strong>Google Adsense</strong> to Monetize</li>
</ol>
<ol class="menu_cont">
<li><span class="ico1">2009.06</span></li>
<li><span class="ico2"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">comments</a></span></li>
<li><span class="ico3"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Tweet!</a></span></li>
</ol>
</div>
<div class="image_cont">
<a href="http://www.pvmgarage.com/"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/sport.jpg" alt="pvm"></a>
</div>
</div>
<div id="featured-3" class="featured_content ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
<h1>Jazz Musician - www.jazzmusician.com</h1>
<div class="feat_left">
<ol>
<li>PhotoShop Web Layout</li>
<li>Web Layout <strong>(X)HTML/CSS</strong></li>
<li><strong>Joomla</strong> Theme</li>
<li>Web Writing and <strong>Advertise</strong></li>
<li>Search Engine Optimization</li>
<li><strong>Google Adsense</strong> to Monetize</li>
</ol>
<ol class="menu_cont">
<li><span class="ico1">2009.05</span></li>
<li><span class="ico2"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">comments</a></span></li>
<li><span class="ico3"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Tweet!</a></span></li>
</ol>
</div>
<div class="image_cont">
<a href="http://www.pvmgarage.com/"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/jazz.jpg" alt="pvm"></a>
</div>
</div>
<div id="featured-4" class="featured_content ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
<h1>La Terrazza - www.laterrazzabeb.com</h1>
<div class="feat_left">
<ol>
<li>PhotoShop and Logo Design</li>
<li>Web Layout <strong>(X)HTML/CSS</strong></li>
<li><strong>Joomla</strong> Theme</li>
<li>Web Writing and <strong>Advertise</strong></li>
<li>Search Engine Optimization</li>
<li><strong>Google Adsense</strong> to Monetize</li>
</ol>
<ol class="menu_cont">
<li><span class="ico1">2009.05</span></li>
<li><span class="ico2"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">comments</a></span></li>
<li><span class="ico3"><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Tweet!</a></span></li>
</ol>
</div>
<div class="image_cont">
<a href="http://www.pvmgarage.com/"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/terrazza.jpg" alt="pvm"></a>
</div>
</div>
</div>
<div id="down_container">
<div class="down_1">
<h1>Great Design</h1>
<a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/line25.jpg" alt="line25"></a>
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue.</p>
</div>
<div class="down_2">
<h1>Cicero</h1>
<a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/cowboy.jpg" alt="line25"></a>
<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum.</p>
</div>
</div>
</div>
<div id="sidebar">
<div class="side_cont">
<h2>Services</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
</div>
<div class="side_cont">
<h2>Recent Posts</h2>
<h3><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Donec quam felis, ultricies nec, pellentesque eu.</a></h3>
<span class="meta_info">posted by piervix - 12.08</span>
<h3><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Donec quam felis, ultricies nec, pellentesque eu.</a></h3>
<span class="meta_info">posted by piervix - 12.08</span>
<h3><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Donec quam felis, ultricies nec, pellentesque eu.</a></h3>
<span class="meta_info">posted by piervix - 12.08</span>
<h3><a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#">Donec quam felis, ultricies nec, pellentesque eu.</a></h3>
<span class="meta_info">posted by piervix - 12.08</span>
</div>
<div class="side_cont">
<h2>Working on...</h2>
<p>Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. </p>
<a href="http://www.pvmgarage.com/downloads/watercolored_portfolio/#"><img src="http://www.pvmgarage.com/downloads/watercolored_portfolio/images/designschool.jpg" alt="design"></a>
</div>
</div>
<div class="side_bottom">
</div>
<div class="clear_sep"></div>
<div id="footer">
<p><strong>WATERCOLORED PORTFOLIO 2009</strong> - <em>Creative Common License.</em> It's a free template for you!<br>
a PV.M GARAGE PRODUCTION - <a href="http://validator.w3.org/check?uri=referer">valid (X)HTML</a> and <a href="http://jigsaw.w3.org/css-validator/check/referer">valid CSS</a></p>
</div>
</div>
</body></html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment