Created
February 11, 2013 00:15
-
-
Save drakakisgeo/4751649 to your computer and use it in GitHub Desktop.
Snippets for new projects
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
########################################## | |
# NEW HTML5 DOC | |
########################################## | |
<!doctype html> | |
<html lang="en-US"> | |
<head> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
<title>Default Page Title</title> | |
<link rel="shortcut icon" href="favicon.ico"> | |
<link rel="icon" href="favicon.ico"> | |
<link rel="stylesheet" type="text/css" href="styles.css"> | |
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> | |
<!--[if lt IE 9]> | |
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> | |
<![endif]--> | |
</head> | |
<body> | |
</body> | |
</html> | |
########################################## | |
# CLEARFIX FLOATS | |
########################################## | |
.clearfix:before, .container:after { content: ""; display: table; } | |
.clearfix:after { clear: both; } | |
/* IE 6/7 */ | |
.clearfix { zoom: 1; } | |
########################################## | |
# CSS RESET | |
########################################## | |
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { | |
margin: 0; | |
padding: 0; | |
border: 0; | |
font-size: 100%; | |
font: inherit; | |
vertical-align: baseline; | |
outline: none; | |
} | |
html { height: 101%; } /* always display scrollbars */ | |
body { font-size: 62.5%; line-height: 1; font-family: Arial, Tahoma, Verdana, sans-serif; } | |
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } | |
ol, ul { list-style: none; } | |
blockquote, q { quotes: none; } | |
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } | |
strong { font-weight: bold; } | |
input { outline: none; } | |
table { border-collapse: collapse; border-spacing: 0; } | |
img { border: 0; max-width: 100%; } | |
a { text-decoration: none; } | |
a:hover { text-decoration: underline; } | |
########################################## | |
# HTML5 EMBEDED AUDIO / VIDEO | |
########################################## | |
<video poster="images/preview.png" width="1280" height="720" controls="controls" preload="none"> | |
<source src="media/video.mp4" type="video/mp4"></source> | |
<source src="media/video.webm" type="video/webm"></source> | |
<source src="media/video.ogg" type="video/ogg"></source> | |
</video> | |
<audio controls="controls" preload="none"> | |
<source src="music.ogg" type="audio/ogg"> | |
<source src="music.mp3" type="audio/mpeg"> | |
</audio> | |
########################################## | |
# HTML TAGS FOR RESPONSIVE LAYOUT | |
########################################## | |
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
<meta name="HandheldFriendly" content="true"> | |
########################################## | |
# CUSTOM FONT FACE | |
########################################## | |
@font-face{ | |
font-family: 'MyFont'; | |
src: url('myfont.eot'); | |
src: url('myfont.eot?#iefix') format('embedded-opentype'), | |
url('myfont.woff') format('woff'), | |
url('myfont.ttf') format('truetype'), | |
url('myfont.svg#webfont') format('svg'); | |
} | |
h1 { font-family: 'MyFont', sans-serif; } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment