Skip to content

Instantly share code, notes, and snippets.

@kikobr

kikobr/grid.html

Created July 2, 2013 16:57
Show Gist options
  • Save kikobr/5911063 to your computer and use it in GitHub Desktop.
Save kikobr/5911063 to your computer and use it in GitHub Desktop.
Download ZIP
Foundation
Raw
grid.html
<!DOCTYPE html>
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en" > <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en" > <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title> --Title--- </title>
<link rel="stylesheet" href="css/foundation.css" />
<script src="js/vendor/custom.modernizr.js"></script>
</head>
<body>
<div class="row">
<!-- Small para telas menos de 760+-. Caso haja só uma resolução, pode deixar só o small. -->
<div class="small-12 column">
<h1>Título</h1>
</div>
<div class="small-5 large-3 columns">
Lorem ipsum
</div>
<div class="small-7 large-9 columns">
Lorem ipsum Lorem ipsum
</div>
</div>
<div class="row">
<!-- Grid em blocos -->
<ul class="small-block-grid-4 large-block-grid-6">
<li><img /></li>
<li><img /></li>
<li><img /></li>
</ul>
<!-- Orbit slider -->
<ul data-orbit>
<li><img /></li>
<li>
<img />
<div class="orbit-caption">Subtitulo</div>
</li>
</ul>
</div>
<script>
document.write('<script src=' +
('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
'.js><\/script>')
</script>
<script src="js/foundation.min.js"></script>
<script>
$(document).foundation(/*'orbit', {
timer_speed: 2000,
animation_speed: 1000,
bullets:true,
stack_on_small:true
}*/);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment