mirror of
https://github.com/dawidolko/Website-Templates.git
synced 2025-10-30 16:03:11 +01:00
169 lines
6.2 KiB
HTML
169 lines
6.2 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<meta http-equiv="content-type" content="text/html;charset=utf-8">
|
|
<title>CSS3_B&W Template</title>
|
|
<style type="text/css" media="screen">
|
|
p, table, hr, .box { font-family: arial; margin-bottom:25px; }
|
|
.box p { margin-bottom:10px; }
|
|
</style>
|
|
</head>
|
|
|
|
|
|
<body>
|
|
<div>
|
|
|
|
<h1>“CSS3_B&W” Template Documentation</h1>
|
|
|
|
<p><strong>Template version: 2.0<br />Created: July 19th 2012</strong></p>
|
|
|
|
<div>
|
|
<p>Thank you for downloading this template.</p>
|
|
<p>This template is released under a <a href="http://creativecommons.org/licenses/by/3.0">Creative Commons Attribution 3.0 Licence</a>. This means you are free to download and use it for personal and commercial projects. However, you <strong>must leave the 'design from css3templates.co.uk' link in the footer of the template</strong>.</p>
|
|
<p>If you have any questions that are beyond the scope of this help file, please feel free to contact me via my <a href="http://www.css3templates.co.uk">website</a>. Thank you!</p>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<h2 id="toc">Table of Contents</h2>
|
|
<ol>
|
|
<li><a href="#htmlStructure">HTML Structure</a></li>
|
|
<li><a href="#cssFiles">CSS Files and Structure</a></li>
|
|
<li><a href="#fontFiles">Fonts</a></li>
|
|
<li><a href="#javascript">JavaScript</a></li>
|
|
<li><a href="#credits">Sources and Credits</a></li>
|
|
</ol>
|
|
|
|
<hr>
|
|
|
|
<h3 id="htmlStructure"><strong>A) HTML Structure</strong> - <a href="#toc">top</a></h3>
|
|
<p>Here is the HTML structure for this template.</p>
|
|
|
|
<pre>
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- Header Metatags -->
|
|
<!-- Main Stylesheet -->
|
|
<!-- Modernizr JS Enables HTML5 Elements -->
|
|
</head>
|
|
<body>
|
|
<div id="main">
|
|
<!-- begin header -->
|
|
<header>
|
|
<div id="logo"</div>
|
|
<nav>
|
|
<!-- menu -->
|
|
</nav>
|
|
</header>
|
|
<!-- end header -->
|
|
<!-- begin content -->
|
|
<div id="site_content">
|
|
<ul id="images">
|
|
<li><img src="images/1.jpg" width="600" height="300" alt="photo_one" /></li>
|
|
<li><img src="images/2.jpg" width="600" height="300" alt="photo_two" /></li>
|
|
<li><img src="images/3.jpg" width="600" height="300" alt="photo_three" /></li>
|
|
<li><img src="images/4.jpg" width="600" height="300" alt="photo_four" /></li>
|
|
<li><img src="images/5.jpg" width="600" height="300" alt="photo_five" /></li>
|
|
<li><img src="images/6.jpg" width="600" height="300" alt="photo_six" /></li>
|
|
</ul>
|
|
<div id="sidebar_container">
|
|
<div class="sidebar"></div>
|
|
</div>
|
|
<div id="content"></div>
|
|
</div>
|
|
<!-- end content -->
|
|
<!-- begin footer -->
|
|
<footer></footer>
|
|
<!-- end footer -->
|
|
</div>
|
|
<p>&nbsp;</p>
|
|
<!-- jQuery with plugins -->
|
|
<script type="text/javascript">
|
|
$(document).ready(function(){
|
|
<!-- initialise image transition -->
|
|
$('#images').kwicks({
|
|
max : 600,
|
|
spacing : 2
|
|
});
|
|
});
|
|
</script>
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
$("#lava_menu").lavaLamp({
|
|
fx: "backout",
|
|
speed: 700
|
|
});
|
|
});
|
|
</script>
|
|
</html>
|
|
</body>
|
|
</pre>
|
|
|
|
<hr>
|
|
|
|
<h3 id="cssFiles"><strong>B) CSS Files and Structure</strong> - <a href="#toc">top</a></h3>
|
|
|
|
<p>There is one stylesheet used in this theme:</p>
|
|
<ol>
|
|
<li><b>css/style.css</b></li>
|
|
</ol>
|
|
|
|
<ol>
|
|
<li><b>style.css</b> is the main stylesheet and is included in all pages. It contains all the structural stylings for the template.</li>
|
|
</ol>
|
|
|
|
<hr>
|
|
|
|
<h3 id="fontFiles"><strong>C) Fonts</strong> - <a href="#toc">top</a></h3>
|
|
|
|
<p>There is 1 font used in this theme. The font is News Cycle. The font files are</p>
|
|
<ol>
|
|
<li><b>fonts/NewsCycle-Regular.ttf</b></li>
|
|
<li><b>fonts/NewsCycle-Regular.eot</b> (IE Specific)</li>
|
|
</ol>
|
|
|
|
<hr>
|
|
|
|
<h3 id="javascript"><strong>D) JavaScript</strong> - <a href="#toc">top</a></h3>
|
|
|
|
<p>This theme imports several Javascript files.</p>
|
|
|
|
<ol>
|
|
<li>js/modernizr-1.5.min.js</li>
|
|
<li>js/jquery.min.js</li>
|
|
<li>js/jquery.easing.min.js</li>
|
|
<li>js/jquery.lavalamp.min.js</li>
|
|
<li>js/jquery.kwicks-1.5.1.js</li>
|
|
</ol>
|
|
|
|
<ol>
|
|
<li><b>modernizr</b> is a Javascript library that enables HTML5 elements and feature detects.</li>
|
|
<li><b>jQuery</b> is a Javascript library containing lots of commonly used Javascript functions.</li>
|
|
<li><b>Easing</b> is a jQuery plugin for easing transitions.</li>
|
|
<li><b>Lavalamp</b> is a jQuery plugin for the lavalamp menu.</li>
|
|
<li><b>Kwicks</b> is a jQuery plugin for the image transitions.</li>
|
|
</ol>
|
|
|
|
<hr>
|
|
|
|
<h3 id="credits"><strong>E) Sources and Credits</strong> - <a href="#toc">top</a></h3>
|
|
|
|
<p>I've used the following images, icons or other files as listed.
|
|
|
|
<ul>
|
|
<li><a href="http://www.modernizr.com">modernizr</a> (MIT and BSD licenses)</li>
|
|
<li><a href="http://www.jquery.com">jQuery</a> (MIT and GPL licenses)</li>
|
|
<li><a href="http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/">Lavalamp menu</a></li>
|
|
<li><a href="http://www.jeremymartin.name/projects.php?project=kwicks">Kwicks</a> (MIT license)</li>
|
|
</ul>
|
|
|
|
<hr>
|
|
|
|
<p>Once again, thank you for downloading this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist.</p>
|
|
|
|
<p><a href="#toc">Go To Table of Contents</a></p>
|
|
|
|
<hr>
|
|
</div>
|
|
</body>
|
|
</html> |