Advertisement
Guest User

Untitled

a guest
Oct 13th, 2011
305
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 7.10 KB | None | 0 0
  1.  
  2. <!doctype html>
  3. <!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
  4. <!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
  5. <!--[if IE 7]>    <html class="no-js ie7 oldie" lang="en"> <![endif]-->
  6. <!--[if IE 8]>    <html class="no-js ie8 oldie" lang="en"> <![endif]-->
  7. <!-- Consider adding an manifest.appcache: h5bp.com/d/Offline -->
  8. <!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
  9. <head>
  10.   <meta charset="utf-8">
  11.  
  12.   <!-- Use the .htaccess and remove these lines to avoid edge case issues.
  13.       More info: h5bp.com/b/378 -->
  14.   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  15.  
  16.   <title></title>
  17.   <meta name="description" content="">
  18.   <meta name="author" content="">
  19.  
  20.   <!-- Mobile viewport optimized: j.mp/bplateviewport -->
  21.   <meta name="viewport" content="width=device-width,initial-scale=1">
  22.  
  23.   <!-- Place favicon.ico and apple-touch-icon.png in the root directory: mathiasbynens.be/notes/touch-icons -->
  24.  
  25.   <!-- CSS: implied media=all -->
  26.   <!-- CSS concatenated and minified via ant build script-->
  27.   <link rel="stylesheet" href="http://cdb/css/style.css">
  28.   <link rel="stylesheet" href="http://cdb/css/minimalism.css">
  29.   <!-- end CSS-->
  30.  
  31.   <!-- More ideas for your <head> here: h5bp.com/d/head-Tips -->
  32.  
  33.   <!-- All JavaScript at the bottom, except for Modernizr / Respond.
  34.       Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
  35.       For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
  36.   <script src="http://cdb/js/libs/modernizr-2.0.6.min.js"></script>
  37. </head>
  38.  
  39. <body>
  40.    <div class="bg">
  41.      <!--start container-->
  42.  
  43.      <div id="container">
  44.        <!--start header-->
  45.  
  46.        <header><a href="#" id="logo"><img src="http://cdb/img/logo.png" width="250" height="45" alt="logo"></a> <!--end logo-->
  47. <!--start menu-->
  48. <nav>
  49.     <ul>
  50.         <li><a href="http://cdb/home" class="current">Home</a></li>
  51.  
  52.         <li><a href="http://cdb/contact">About Me</a></li>
  53.  
  54.         <li><a href="#">My Services</a></li>
  55.  
  56.         <li><a href="#">Portfolio</a></li>
  57.  
  58.         <li><a href="#">Resume</a></li>
  59.  
  60.         <li><a href="#">Contact Me</a></li>
  61.     </ul>
  62. </nav>
  63. <!--end menu-->
  64. </header>
  65.  
  66.        <div id="main" role="main">
  67.         <!--start intro-->
  68.    <a href="http://jquery.com/">jQuery</a>
  69.    
  70.    <script>
  71.      $(document).ready(function(){
  72.        $("a").click(function(event){
  73.          alert("As you can see, the link no longer took you to jquery.com");
  74.          event.preventDefault();
  75.        });
  76.      });
  77.    </script>
  78.    
  79.    <section id="intro">
  80.        <hgroup>
  81.            <h1>"Simplicity is the ultimate sophistication"<span>- Leonardo da Vinci</span></h1>
  82.  
  83.            <h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero.</h2>
  84.        </hgroup>
  85.    </section>
  86.    <!--end intro-->
  87.    <!--start holder-->
  88.    <div class="holder_content">
  89.        <section class="group1">
  90.            <h3>About us</h3>
  91.  
  92.            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy.</p><a class="photo_hover3" href="#"><img src="images/picture1.jpg" width="240" height="214" alt="picture1"></a> <a href="#"><span class="button">Read more</span></a>
  93.        </section>
  94.  
  95.        <section class="group2">
  96.            <h3>Services</h3>
  97.  
  98.            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy.</p><a class="photo_hover3" href="#"><img src="images/picture2.jpg" width="240" height="214" alt="picture1"></a> <a href="#"><span class="button">Read more</span></a>
  99.        </section>
  100.  
  101.        <section class="group3">
  102.            <h3>Latest news</h3>
  103.  
  104.            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy.</p><a class="photo_hover3" href="#"><img src="images/picture3.jpg" width="240" height="214" alt="picture1"></a> <a href="#"><span class="button">Read more</span></a>
  105.        </section>
  106.    </div><!--end holder-->
  107.    <!--start holder-->
  108.  
  109.    <div class="holder_content">
  110.        <section class="group4">
  111.            <h3>Latest article</h3>
  112.  
  113.            <article>
  114.                <h4>22.08.2011 - Design to express</h4>
  115.  
  116.                <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero.</p>
  117.  
  118.                <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras quis libero.</p>
  119.  
  120.                <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie. Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum facilisis nulla. In hac habitasse platea dictumst.</p>
  121.            </article>
  122.        </section>
  123.    </div>
  124.    <!--end holder-->
  125. </div>
  126. <!--end container-->       </div>
  127.  
  128.        <footer><div class="container">
  129.     <div id="FooterTwo">
  130.        
  131.     </div>
  132.  
  133.     <div id="FooterTree">
  134.          &copy; 2011 All Rights Reserved</a>
  135.     </div>
  136. </div>
  137. </footer><!--end footer-->
  138.      </div>
  139.    </div>
  140.    <!--end bg-->
  141.  
  142.  
  143.   <!-- JavaScript at the bottom for fast page loading -->
  144.  
  145.   <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
  146.   <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
  147.   <script>window.jQuery || document.write('<script src="http://cdb/js/libs/jquery-1.6.2.min.js"><\/script>')</script>
  148.  
  149.  
  150.   <!-- scripts concatenated and minified via ant build script-->
  151.   <script defer src="http://cdb/js/plugins.js"></script>
  152.   <script defer src="http://cdb/js/script.js"></script>
  153.   <!-- end scripts-->
  154.  
  155.    
  156.   <!-- Change UA-XXXXX-X to be your site's ID -->
  157.   <script>
  158.     window._gaq = [['_setAccount','UA-3178237-2'],['_trackPageview'],['_trackPageLoadTime']];
  159.     Modernizr.load({
  160.       load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js'
  161.     });
  162.   </script>
  163.  
  164.  
  165.   <!-- Prompt IE 6 users to install Chrome Frame. Remove this if you want to support IE 6.
  166.       chromium.org/developers/how-tos/chrome-frame-getting-started -->
  167.   <!--[if lt IE 7 ]>
  168.    <script src="//ajax.googleapis.com/ajax/libs/chrome-frame/1.0.3/CFInstall.min.js"></script>
  169.    <script>window.attachEvent('onload',function(){CFInstall.check({mode:'overlay'})})</script>
  170.  <![endif]-->
  171.  
  172. </body>
  173. </html>
  174.  
  175.  
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement