Compare commits
89 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
72cdf1e96c | ||
|
|
f033325bac | ||
|
|
d144341003 | ||
|
|
71ca9fb7a0 | ||
|
|
23f5e084e5 | ||
|
|
da9528e568 | ||
|
|
ab6b2fc4aa | ||
|
|
ab05d000f8 | ||
|
|
8a68443746 | ||
|
|
cd981e52f7 | ||
|
|
2cf1ef7cea | ||
|
|
5bc2a985c7 | ||
|
|
21c614849a | ||
|
|
01624d71f5 | ||
|
|
be4484add0 | ||
|
|
ce7c3c5c15 | ||
|
|
ff37dba6bf | ||
|
|
8fc26501f4 | ||
|
|
9ec546569b | ||
|
|
02713eedd2 | ||
|
|
8f743702f6 | ||
|
|
48d49e96d6 | ||
|
|
deec362213 | ||
|
|
713abf57a9 | ||
|
|
f27c2b7372 | ||
|
|
52f17087f9 | ||
|
|
7a22a33d40 | ||
|
|
0adda79fee | ||
|
|
d94e506189 | ||
|
|
fa7527fb26 | ||
|
|
2a8e5828af | ||
|
|
6cfbc95cd6 | ||
|
|
a7a4d0685c | ||
|
|
c8b0431c7d | ||
|
|
1b0f042e06 | ||
|
|
a10460934d | ||
|
|
b83ce3b1b4 | ||
|
|
c01aa0474d | ||
|
|
2f966781d8 | ||
|
|
b4587434f8 | ||
|
|
522fa645c3 | ||
|
|
19c03c4bf0 | ||
|
|
7dae637800 | ||
|
|
922df45999 | ||
|
|
aa9bcbeb5b | ||
|
|
c3358e2399 | ||
|
|
3a7de0b41a | ||
|
|
964c929ef0 | ||
|
|
e9a471bc3f | ||
|
|
29315016dc | ||
|
|
90f99e1587 | ||
|
|
fb9166461b | ||
|
|
21702c4198 | ||
|
|
7bc8241f51 | ||
|
|
a2b3d06e8b | ||
|
|
081f8aa0de | ||
|
|
1987e5a1ee | ||
|
|
46446727b2 | ||
|
|
3d5d852697 | ||
|
|
052ecc4b29 | ||
|
|
dac15682b3 | ||
|
|
8c08445487 | ||
|
|
d141f70910 | ||
|
|
e9f6a9890c | ||
|
|
e85301270f | ||
|
|
0615b940c3 | ||
|
|
551dd5c5d6 | ||
|
|
25c1073d13 | ||
|
|
7b04f32d5a | ||
|
|
750bf0e093 | ||
|
|
dc00673b7c | ||
|
|
5bed678da0 | ||
|
|
578f377849 | ||
|
|
e1b163041e | ||
|
|
4ac3ffef5c | ||
|
|
6be0119cd2 | ||
|
|
e6c64a238d | ||
|
|
b378ce239d | ||
|
|
2c079ae144 | ||
|
|
2dd1153cfc | ||
|
|
bfeac11c9a | ||
|
|
bb7b3577b1 | ||
|
|
d20a342c95 | ||
|
|
0dcd9d120e | ||
|
|
cb0bb16eb7 | ||
|
|
dd420ef187 | ||
|
|
1c6485adb9 | ||
|
|
d4467ad7f2 | ||
|
|
5735ee396d |
2
404.html
@@ -151,7 +151,7 @@
|
||||
<script>
|
||||
var GOOG_FIXURL_LANG = (navigator.language || '').slice(0,2),GOOG_FIXURL_SITE = location.host;
|
||||
</script>
|
||||
<script src="http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script>
|
||||
<script src="//linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js"></script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
48
CHANGELOG.md
@@ -1,6 +1,52 @@
|
||||
### HEAD
|
||||
|
||||
### 4.0.0 (28 August, 2012)
|
||||
### 4.3.0 (September 10, 2013)
|
||||
|
||||
* Use one apple-touch-icon instead of six ([#1367](https://github.com/h5bp/html5-boilerplate/issues/1367)).
|
||||
* Move font-related declarations from `body` to `html` ([#1411](https://github.com/h5bp/html5-boilerplate/issues/1411)).
|
||||
* Update to Apache Server Configs 1.1.0.
|
||||
* Add `initial-scale=1` to the viewport `meta` ([#1398](https://github.com/h5bp/html5-boilerplate/pull/1398)).
|
||||
* Vertical centering for audio-, canvas- and video-tags ([#1326](https://github.com/h5bp/html5-boilerplate/issues/1326)).
|
||||
* Remove Google Chrome Frame related code ([#1379](https://github.com/h5bp/html5-boilerplate/pull/1379), [#1396](https://github.com/h5bp/html5-boilerplate/pull/1396)).
|
||||
* Update to Google Universal Analytics ([#1347](https://github.com/h5bp/html5-boilerplate/issues/1347)).
|
||||
* Update to jQuery 1.10.2.
|
||||
* Update to Normalize.css 1.1.3.
|
||||
|
||||
### 4.2.0 (April 8, 2013)
|
||||
|
||||
* Remove Google Analytics protocol check ([#1319](https://github.com/h5bp/html5-boilerplate/pull/1319)).
|
||||
* Update to Normalize.css 1.1.1.
|
||||
* Update Apache configurations to include the latest changes in the canonical
|
||||
[`.htaccess`](https://github.com/h5bp/server-configs-apache) file.
|
||||
* Use a protocol relative URL for the 404 template script.
|
||||
* Update to jQuery 1.9.1.
|
||||
|
||||
### 4.1.0 (January 21, 2013)
|
||||
|
||||
* Update to Normalize.css 1.1.0.
|
||||
* Update to jQuery 1.9.0.
|
||||
|
||||
### 4.0.3 (January 12, 2013)
|
||||
|
||||
* Use 32x32 favicon.ico ([#1286](https://github.com/h5bp/html5-boilerplate/pull/1286)).
|
||||
* Remove named function expression in plugins.js ([#1280](https://github.com/h5bp/html5-boilerplate/pull/1280)).
|
||||
* Adjust CSS image-replacement code ([#1239](https://github.com/h5bp/html5-boilerplate/issues/1239)).
|
||||
* Update HiDPI example media query ([#1127](https://github.com/h5bp/html5-boilerplate/issues/1127)).
|
||||
|
||||
### 4.0.2 (December 9, 2012)
|
||||
|
||||
* Update placeholder icons.
|
||||
* Update to Normalize.css 1.0.2.
|
||||
* Update to jQuery 1.8.3.
|
||||
|
||||
### 4.0.1 (October 20, 2012)
|
||||
|
||||
* Further improvements to `console` method stubbing ([#1206](https://github.com/h5bp/html5-boilerplate/issues/1206), [#1229](https://github.com/h5bp/html5-boilerplate/pull/1229)).
|
||||
* Update to jQuery 1.8.2.
|
||||
* Update to Modernizr 2.6.2.
|
||||
* Minor additions to the documentation.
|
||||
|
||||
### 4.0.0 (August 28, 2012)
|
||||
|
||||
* Improve the Apache compression configuration ([#1012](https://github.com/h5bp/html5-boilerplate/issues/1012), [#1173](https://github.com/h5bp/html5-boilerplate/issues/1173)).
|
||||
* Add a HiDPI example media query ([#1127](https://github.com/h5bp/html5-boilerplate/issues/1127)).
|
||||
|
||||
154
CONTRIBUTING.md
Normal file
@@ -0,0 +1,154 @@
|
||||
# Contributing to HTML5 Boilerplate
|
||||
|
||||
♥ [HTML5 Boilerplate](http://html5boilerplate.com) and want to get involved?
|
||||
Thanks! There are plenty of ways you can help!
|
||||
|
||||
Please take a moment to review this document in order to make the contribution
|
||||
process easy and effective for everyone involved.
|
||||
|
||||
Following these guidelines helps to communicate that you respect the time of
|
||||
the developers managing and developing this open source project. In return,
|
||||
they should reciprocate that respect in addressing your issue or assessing
|
||||
patches and features.
|
||||
|
||||
|
||||
## Using the issue tracker
|
||||
|
||||
The [issue tracker](https://github.com/h5bp/html5-boilerplate/issues) is
|
||||
the preferred channel for [bug reports](#bugs), [features requests](#features)
|
||||
and [submitting pull requests](#pull-requests), but please respect the following
|
||||
restrictions:
|
||||
|
||||
* Please **do not** use the issue tracker for personal support requests (use
|
||||
[Stack Overflow](http://stackoverflow.com/questions/tagged/html5boilerplate)
|
||||
or IRC).
|
||||
|
||||
* Please **do not** derail or troll issues. Keep the discussion on topic and
|
||||
respect the opinions of others.
|
||||
|
||||
* Please **do not** open issues or pull requests regarding the code in
|
||||
[`.htaccess`](https://github.com/h5bp/server-configs-apache),
|
||||
[`jQuery`](https://github.com/jquery/jquery/),
|
||||
[`Modernizr`](https://github.com/Modernizr/Modernizr) or
|
||||
[`Normalize.css`](https://github.com/necolas/normalize.css) (open them in
|
||||
their respective repositories).
|
||||
|
||||
|
||||
<a name="bugs"></a>
|
||||
## Bug reports
|
||||
|
||||
A bug is a _demonstrable problem_ that is caused by the code in the repository.
|
||||
Good bug reports are extremely helpful - thank you!
|
||||
|
||||
Guidelines for bug reports:
|
||||
|
||||
1. **Use the GitHub issue search** — check if the issue has already been
|
||||
reported.
|
||||
|
||||
2. **Check if the issue has been fixed** — try to reproduce it using the
|
||||
latest `master` or development branch in the repository.
|
||||
|
||||
3. **Isolate the problem** — ideally create a [reduced test
|
||||
case](http://css-tricks.com/6263-reduced-test-cases/) and a live example.
|
||||
|
||||
A good bug report shouldn't leave others needing to chase you up for more
|
||||
information. Please try to be as detailed as possible in your report. What is
|
||||
your environment? What steps will reproduce the issue? What browser(s) and OS
|
||||
experience the problem? What would you expect to be the outcome? All these
|
||||
details will help people to fix any potential bugs.
|
||||
|
||||
Example:
|
||||
|
||||
> Short and descriptive example bug report title
|
||||
>
|
||||
> A summary of the issue and the browser/OS environment in which it occurs. If
|
||||
> suitable, include the steps required to reproduce the bug.
|
||||
>
|
||||
> 1. This is the first step
|
||||
> 2. This is the second step
|
||||
> 3. Further steps, etc.
|
||||
>
|
||||
> `<url>` - a link to the reduced test case
|
||||
>
|
||||
> Any other information you want to share that is relevant to the issue being
|
||||
> reported. This might include the lines of code that you have identified as
|
||||
> causing the bug, and potential solutions (and your opinions on their
|
||||
> merits).
|
||||
|
||||
|
||||
<a name="features"></a>
|
||||
## Feature requests
|
||||
|
||||
Feature requests are welcome. But take a moment to find out whether your idea
|
||||
fits with the scope and aims of the project. It's up to *you* to make a strong
|
||||
case to convince the project's developers of the merits of this feature. Please
|
||||
provide as much detail and context as possible.
|
||||
|
||||
|
||||
<a name="pull-requests"></a>
|
||||
## Pull requests
|
||||
|
||||
Good pull requests - patches, improvements, new features - are a fantastic
|
||||
help. They should remain focused in scope and avoid containing unrelated
|
||||
commits.
|
||||
|
||||
**Please ask first** before embarking on any significant pull request (e.g.
|
||||
implementing features, refactoring code, porting to a different language),
|
||||
otherwise you risk spending a lot of time working on something that the
|
||||
project's developers might not want to merge into the project.
|
||||
|
||||
Please adhere to the coding conventions used throughout a project (indentation,
|
||||
accurate comments, etc.) and any other requirements (such as test coverage).
|
||||
|
||||
Adhering to the following this process is the best way to get your work
|
||||
included in the project:
|
||||
|
||||
1. [Fork](http://help.github.com/fork-a-repo/) the project, clone your fork,
|
||||
and configure the remotes:
|
||||
|
||||
```bash
|
||||
# Clone your fork of the repo into the current directory
|
||||
git clone https://github.com/<your-username>/html5-boilerplate.git
|
||||
# Navigate to the newly cloned directory
|
||||
cd html5-boilerplate
|
||||
# Assign the original repo to a remote called "upstream"
|
||||
git remote add upstream https://github.com/h5bp/html5-boilerplate.git
|
||||
```
|
||||
|
||||
2. If you cloned a while ago, get the latest changes from upstream:
|
||||
|
||||
```bash
|
||||
git checkout master
|
||||
git pull upstream master
|
||||
```
|
||||
|
||||
3. Create a new topic branch (off the main project development branch) to
|
||||
contain your feature, change, or fix:
|
||||
|
||||
```bash
|
||||
git checkout -b <topic-branch-name>
|
||||
```
|
||||
|
||||
4. Commit your changes in logical chunks. Please adhere to these [git commit
|
||||
message guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
|
||||
or your code is unlikely be merged into the main project. Use Git's
|
||||
[interactive rebase](https://help.github.com/articles/interactive-rebase)
|
||||
feature to tidy up your commits before making them public.
|
||||
|
||||
5. Locally merge (or rebase) the upstream development branch into your topic branch:
|
||||
|
||||
```bash
|
||||
git pull [--rebase] upstream master
|
||||
```
|
||||
|
||||
6. Push your topic branch up to your fork:
|
||||
|
||||
```bash
|
||||
git push origin <topic-branch-name>
|
||||
```
|
||||
|
||||
7. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/)
|
||||
with a clear title and description.
|
||||
|
||||
**IMPORTANT**: By submitting a patch, you agree to allow the project owners to
|
||||
license your work under the the terms of the [MIT License](LICENSE.md).
|
||||
12
README.md
@@ -49,15 +49,13 @@ Choose one of the following options:
|
||||
|
||||
## Documentation
|
||||
|
||||
Take a look at the [documentation table of
|
||||
contents](/h5bp/html5-boilerplate/blob/master/doc/README.md). This
|
||||
Take a look at the [documentation table of contents](doc/TOC.md). This
|
||||
documentation is bundled with the project, which makes it readily available for
|
||||
offline reading and provides a useful starting point for any documentation
|
||||
you want to write about your project.
|
||||
offline reading and provides a useful starting point for any documentation you
|
||||
want to write about your project.
|
||||
|
||||
|
||||
## Contributing
|
||||
|
||||
Anyone and everyone is welcome to
|
||||
[contribute](/h5bp/html5-boilerplate/blob/master/doc/contribute.md). Hundreds
|
||||
of developers have helped make the HTML5 Boilerplate what it is today.
|
||||
Anyone and everyone is welcome to [contribute](CONTRIBUTING.md). Hundreds of
|
||||
developers have helped make the HTML5 Boilerplate what it is today.
|
||||
|
||||
|
Before Width: | Height: | Size: 2.0 KiB |
|
Before Width: | Height: | Size: 1.8 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
|
Before Width: | Height: | Size: 1.3 KiB |
|
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.2 KiB |
|
Before Width: | Height: | Size: 1.1 KiB |
32
css/main.css
@@ -1,6 +1,6 @@
|
||||
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
|
||||
|
||||
/*
|
||||
* HTML5 Boilerplate
|
||||
*
|
||||
* What follows is the result of much research on cross-browser styling.
|
||||
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
|
||||
* Kroc Camen, and the H5BP dev community and team.
|
||||
@@ -18,14 +18,14 @@ textarea {
|
||||
color: #222;
|
||||
}
|
||||
|
||||
body {
|
||||
html {
|
||||
font-size: 1em;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
/*
|
||||
* Remove text-shadow in selection highlight: h5bp.com/i
|
||||
* These selection declarations have to be separate.
|
||||
* These selection rule sets have to be separate.
|
||||
* Customize the background color to match your design.
|
||||
*/
|
||||
|
||||
@@ -53,10 +53,14 @@ hr {
|
||||
}
|
||||
|
||||
/*
|
||||
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
|
||||
* Remove the gap between images, videos, audio and canvas and the bottom of
|
||||
* their containers: h5bp.com/i/440
|
||||
*/
|
||||
|
||||
img {
|
||||
audio,
|
||||
canvas,
|
||||
img,
|
||||
video {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
@@ -79,10 +83,10 @@ textarea {
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Chrome Frame prompt
|
||||
Browse Happy prompt
|
||||
========================================================================== */
|
||||
|
||||
.chromeframe {
|
||||
.browsehappy {
|
||||
margin: 0.2em 0;
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
@@ -129,7 +133,7 @@ textarea {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 100%;
|
||||
height: 150%;
|
||||
}
|
||||
|
||||
/*
|
||||
@@ -212,7 +216,7 @@ textarea {
|
||||
|
||||
/* ==========================================================================
|
||||
EXAMPLE Media Queries for Responsive Design.
|
||||
Theses examples override the primary ('mobile first') styles.
|
||||
These examples override the primary ('mobile first') styles.
|
||||
Modify as content requires.
|
||||
========================================================================== */
|
||||
|
||||
@@ -220,8 +224,10 @@ textarea {
|
||||
/* Style adjustments for viewports that meet the condition */
|
||||
}
|
||||
|
||||
@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
|
||||
only screen and (min-resolution: 144dpi) {
|
||||
@media print,
|
||||
(-o-min-device-pixel-ratio: 5/4),
|
||||
(-webkit-min-device-pixel-ratio: 1.25),
|
||||
(min-resolution: 120dpi) {
|
||||
/* Style adjustments for high resolution devices */
|
||||
}
|
||||
|
||||
@@ -234,7 +240,7 @@ textarea {
|
||||
* {
|
||||
background: transparent !important;
|
||||
color: #000 !important; /* Black prints faster: h5bp.com/s */
|
||||
box-shadow:none !important;
|
||||
box-shadow: none !important;
|
||||
text-shadow: none !important;
|
||||
}
|
||||
|
||||
|
||||
213
css/normalize.css
vendored
@@ -1,11 +1,11 @@
|
||||
/*! normalize.css v1.0.1 | MIT License | git.io/normalize */
|
||||
/*! normalize.css v1.1.3 | MIT License | git.io/normalize */
|
||||
|
||||
/* ==========================================================================
|
||||
HTML5 display definitions
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Corrects `block` display not defined in IE 6/7/8/9 and Firefox 3.
|
||||
/**
|
||||
* Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
|
||||
*/
|
||||
|
||||
article,
|
||||
@@ -16,14 +16,15 @@ figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
|
||||
/**
|
||||
* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
|
||||
*/
|
||||
|
||||
audio,
|
||||
@@ -34,8 +35,8 @@ video {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents modern browsers from displaying `audio` without controls.
|
||||
/**
|
||||
* Prevent modern browsers from displaying `audio` without controls.
|
||||
* Remove excess height in iOS 5 devices.
|
||||
*/
|
||||
|
||||
@@ -44,9 +45,8 @@ audio:not([controls]) {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling for `hidden` attribute not present in IE 7/8/9, Firefox 3,
|
||||
* and Safari 4.
|
||||
/**
|
||||
* Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
|
||||
* Known issue: no IE 6 support.
|
||||
*/
|
||||
|
||||
@@ -58,21 +58,21 @@ audio:not([controls]) {
|
||||
Base
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Corrects text resizing oddly in IE 6/7 when body `font-size` is set using
|
||||
/**
|
||||
* 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
|
||||
* `em` units.
|
||||
* 2. Prevents iOS text size adjust after orientation change, without disabling
|
||||
* 2. Prevent iOS text size adjust after orientation change, without disabling
|
||||
* user zoom.
|
||||
*/
|
||||
|
||||
html {
|
||||
font-size: 100%; /* 1 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses `font-family` inconsistency between `textarea` and other form
|
||||
/**
|
||||
* Address `font-family` inconsistency between `textarea` and other form
|
||||
* elements.
|
||||
*/
|
||||
|
||||
@@ -84,8 +84,8 @@ textarea {
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses margins handled incorrectly in IE 6/7.
|
||||
/**
|
||||
* Address margins handled incorrectly in IE 6/7.
|
||||
*/
|
||||
|
||||
body {
|
||||
@@ -96,16 +96,16 @@ body {
|
||||
Links
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses `outline` inconsistency between Chrome and other browsers.
|
||||
/**
|
||||
* Address `outline` inconsistency between Chrome and other browsers.
|
||||
*/
|
||||
|
||||
a:focus {
|
||||
outline: thin dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability when focused and also mouse hovered in all browsers.
|
||||
/**
|
||||
* Improve readability when focused and also mouse hovered in all browsers.
|
||||
*/
|
||||
|
||||
a:active,
|
||||
@@ -117,9 +117,9 @@ a:hover {
|
||||
Typography
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses font sizes and margins set differently in IE 6/7.
|
||||
* Addresses font sizes within `section` and `article` in Firefox 4+, Safari 5,
|
||||
/**
|
||||
* Address font sizes and margins set differently in IE 6/7.
|
||||
* Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
|
||||
* and Chrome.
|
||||
*/
|
||||
|
||||
@@ -149,20 +149,20 @@ h5 {
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: 0.75em;
|
||||
font-size: 0.67em;
|
||||
margin: 2.33em 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 7/8/9, Safari 5, and Chrome.
|
||||
/**
|
||||
* Address styling not present in IE 7/8/9, Safari 5, and Chrome.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: 1px dotted;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
|
||||
/**
|
||||
* Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
|
||||
*/
|
||||
|
||||
b,
|
||||
@@ -174,16 +174,27 @@ blockquote {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in Safari 5 and Chrome.
|
||||
/**
|
||||
* Address styling not present in Safari 5 and Chrome.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses styling not present in IE 6/7/8/9.
|
||||
/**
|
||||
* Address differences between Firefox and other browsers.
|
||||
* Known issue: no IE 6/7 normalization.
|
||||
*/
|
||||
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Address styling not present in IE 6/7/8/9.
|
||||
*/
|
||||
|
||||
mark {
|
||||
@@ -191,8 +202,8 @@ mark {
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses margins set differently in IE 6/7.
|
||||
/**
|
||||
* Address margins set differently in IE 6/7.
|
||||
*/
|
||||
|
||||
p,
|
||||
@@ -200,8 +211,8 @@ pre {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects font family set oddly in IE 6, Safari 4/5, and Chrome.
|
||||
/**
|
||||
* Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
|
||||
*/
|
||||
|
||||
code,
|
||||
@@ -213,8 +224,8 @@ samp {
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
/*
|
||||
* Improves readability of pre-formatted text in all browsers.
|
||||
/**
|
||||
* Improve readability of pre-formatted text in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
@@ -223,16 +234,16 @@ pre {
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses CSS quotes not supported in IE 6/7.
|
||||
/**
|
||||
* Address CSS quotes not supported in IE 6/7.
|
||||
*/
|
||||
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses `quotes` property not supported in Safari 4.
|
||||
/**
|
||||
* Address `quotes` property not supported in Safari 4.
|
||||
*/
|
||||
|
||||
q:before,
|
||||
@@ -241,16 +252,16 @@ q:after {
|
||||
content: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses inconsistent and variable font size in all browsers.
|
||||
/**
|
||||
* Address inconsistent and variable font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/*
|
||||
* Prevents `sub` and `sup` affecting `line-height` in all browsers.
|
||||
/**
|
||||
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
@@ -273,8 +284,8 @@ sub {
|
||||
Lists
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses margins set differently in IE 6/7.
|
||||
/**
|
||||
* Address margins set differently in IE 6/7.
|
||||
*/
|
||||
|
||||
dl,
|
||||
@@ -288,8 +299,8 @@ dd {
|
||||
margin: 0 0 0 40px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses paddings set differently in IE 6/7.
|
||||
/**
|
||||
* Address paddings set differently in IE 6/7.
|
||||
*/
|
||||
|
||||
menu,
|
||||
@@ -298,8 +309,8 @@ ul {
|
||||
padding: 0 0 0 40px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects list images handled incorrectly in IE 7.
|
||||
/**
|
||||
* Correct list images handled incorrectly in IE 7.
|
||||
*/
|
||||
|
||||
nav ul,
|
||||
@@ -312,9 +323,9 @@ nav ol {
|
||||
Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* 1. Removes border when inside `a` element in IE 6/7/8/9 and Firefox 3.
|
||||
* 2. Improves image quality when scaled in IE 7.
|
||||
/**
|
||||
* 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
|
||||
* 2. Improve image quality when scaled in IE 7.
|
||||
*/
|
||||
|
||||
img {
|
||||
@@ -322,8 +333,8 @@ img {
|
||||
-ms-interpolation-mode: bicubic; /* 2 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Corrects overflow displayed oddly in IE 9.
|
||||
/**
|
||||
* Correct overflow displayed oddly in IE 9.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
@@ -334,8 +345,8 @@ svg:not(:root) {
|
||||
Figures
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Addresses margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
|
||||
/**
|
||||
* Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
|
||||
*/
|
||||
|
||||
figure {
|
||||
@@ -346,15 +357,15 @@ figure {
|
||||
Forms
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Corrects margin displayed oddly in IE 6/7.
|
||||
/**
|
||||
* Correct margin displayed oddly in IE 6/7.
|
||||
*/
|
||||
|
||||
form {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
/**
|
||||
* Define consistent border, margin, and padding.
|
||||
*/
|
||||
|
||||
@@ -364,10 +375,10 @@ fieldset {
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects color not being inherited in IE 6/7/8/9.
|
||||
* 2. Corrects text not wrapping in Firefox 3.
|
||||
* 3. Corrects alignment displayed oddly in IE 6/7.
|
||||
/**
|
||||
* 1. Correct color not being inherited in IE 6/7/8/9.
|
||||
* 2. Correct text not wrapping in Firefox 3.
|
||||
* 3. Correct alignment displayed oddly in IE 6/7.
|
||||
*/
|
||||
|
||||
legend {
|
||||
@@ -377,11 +388,11 @@ legend {
|
||||
*margin-left: -7px; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Corrects font size not being inherited in all browsers.
|
||||
* 2. Addresses margins set differently in IE 6/7, Firefox 3+, Safari 5,
|
||||
/**
|
||||
* 1. Correct font size not being inherited in all browsers.
|
||||
* 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
|
||||
* and Chrome.
|
||||
* 3. Improves appearance and consistency in all browsers.
|
||||
* 3. Improve appearance and consistency in all browsers.
|
||||
*/
|
||||
|
||||
button,
|
||||
@@ -394,8 +405,8 @@ textarea {
|
||||
*vertical-align: middle; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* Addresses Firefox 3+ setting `line-height` on `input` using `!important` in
|
||||
/**
|
||||
* Address Firefox 3+ setting `line-height` on `input` using `!important` in
|
||||
* the UA stylesheet.
|
||||
*/
|
||||
|
||||
@@ -404,13 +415,25 @@ input {
|
||||
line-height: normal;
|
||||
}
|
||||
|
||||
/*
|
||||
/**
|
||||
* Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
* All other form control elements do not inherit `text-transform` values.
|
||||
* Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
|
||||
* Correct `select` style inheritance in Firefox 4+ and Opera.
|
||||
*/
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
|
||||
* and `video` controls.
|
||||
* 2. Corrects inability to style clickable `input` types in iOS.
|
||||
* 3. Improves usability and consistency of cursor style between image-type
|
||||
* 2. Correct inability to style clickable `input` types in iOS.
|
||||
* 3. Improve usability and consistency of cursor style between image-type
|
||||
* `input` and others.
|
||||
* 4. Removes inner spacing in IE 7 without affecting normal text inputs.
|
||||
* 4. Remove inner spacing in IE 7 without affecting normal text inputs.
|
||||
* Known issue: inner spacing remains in IE 6.
|
||||
*/
|
||||
|
||||
@@ -423,19 +446,19 @@ input[type="submit"] {
|
||||
*overflow: visible; /* 4 */
|
||||
}
|
||||
|
||||
/*
|
||||
/**
|
||||
* Re-set default cursor for disabled elements.
|
||||
*/
|
||||
|
||||
button[disabled],
|
||||
input[disabled] {
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses box sizing set to content-box in IE 8/9.
|
||||
* 2. Removes excess padding in IE 8/9.
|
||||
* 3. Removes excess padding in IE 7.
|
||||
/**
|
||||
* 1. Address box sizing set to content-box in IE 8/9.
|
||||
* 2. Remove excess padding in IE 8/9.
|
||||
* 3. Remove excess padding in IE 7.
|
||||
* Known issue: excess padding remains in IE 6.
|
||||
*/
|
||||
|
||||
@@ -447,9 +470,9 @@ input[type="radio"] {
|
||||
*width: 13px; /* 3 */
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
|
||||
* 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
|
||||
/**
|
||||
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
|
||||
* 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
|
||||
* (include `-moz` to future-proof).
|
||||
*/
|
||||
|
||||
@@ -460,8 +483,8 @@ input[type="search"] {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and search cancel button in Safari 5 and Chrome
|
||||
/**
|
||||
* Remove inner padding and search cancel button in Safari 5 and Chrome
|
||||
* on OS X.
|
||||
*/
|
||||
|
||||
@@ -470,8 +493,8 @@ input[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/*
|
||||
* Removes inner padding and border in Firefox 3+.
|
||||
/**
|
||||
* Remove inner padding and border in Firefox 3+.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
@@ -480,9 +503,9 @@ input::-moz-focus-inner {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Removes default vertical scrollbar in IE 6/7/8/9.
|
||||
* 2. Improves readability and alignment in all browsers.
|
||||
/**
|
||||
* 1. Remove default vertical scrollbar in IE 6/7/8/9.
|
||||
* 2. Improve readability and alignment in all browsers.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
@@ -494,7 +517,7 @@ textarea {
|
||||
Tables
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
/**
|
||||
* Remove most spacing between table cells.
|
||||
*/
|
||||
|
||||
|
||||
@@ -12,16 +12,15 @@
|
||||
* [HTML](html.md) — A guide to the default HTML.
|
||||
* [CSS](css.md) — A guide to the default CSS.
|
||||
* [JavaScript](js.md) — A guide to the default JavaScript.
|
||||
* [.htaccess](htaccess.md) — All about the Apache web server config (also see
|
||||
our [alternative server configs](https://github.com/h5bp/server-configs)).
|
||||
* [.htaccess](https://github.com/h5bp/server-configs-apache/tree/master/doc)
|
||||
— All about the Apache web server configs (also see our [alternative server
|
||||
configs](https://github.com/h5bp/server-configs/blob/master/README.md)).
|
||||
* [crossdomain.xml](crossdomain.md) — An introduction to making use of
|
||||
crossdomain requests.
|
||||
* [Everything else](misc.md).
|
||||
|
||||
## Development
|
||||
|
||||
* [Contributing to HTML5 Boilerplate](contribute.md) — Guidelines on how to
|
||||
contribute effectively.
|
||||
* [Extending and customizing HTML5 Boilerplate](extend.md) — Going further with
|
||||
the boilerplate.
|
||||
|
||||
@@ -31,8 +30,8 @@ HTML5 Boilerplate has several related projects to help improve the performance
|
||||
of your site/app in various production environments.
|
||||
|
||||
* [Server configs](https://github.com/h5bp/server-configs) — Configs for
|
||||
non-Apache servers.
|
||||
different servers.
|
||||
* [Node build script](https://github.com/h5bp/node-build-script) — A
|
||||
feature-rich [grunt](https://github.com/cowboy/grunt) plugin.
|
||||
feature-rich [grunt](https://github.com/gruntjs/grunt) plugin.
|
||||
* [Ant build script](https://github.com/h5bp/ant-build-script) — The original
|
||||
HTML5 Boilerplate build script.
|
||||
@@ -1,104 +0,0 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
|
||||
# Contributing to HTML5 Boilerplate
|
||||
|
||||
♥ HTML5 Boilerplate and want to get involved? Thanks! There are plenty of ways
|
||||
you can help!
|
||||
|
||||
|
||||
## Reporting issues
|
||||
|
||||
A bug is a _demonstrable problem_ that is caused by the code in the
|
||||
repository.
|
||||
|
||||
Please read the following guidelines before you [report an issue](https://github.com/h5bp/html5-boilerplate/issues/):
|
||||
|
||||
1. **Use the GitHub issue search** — check if the issue has already been
|
||||
reported. If it has been, please comment on the existing issue.
|
||||
|
||||
2. **Check if the issue has been fixed** — the latest `master` or
|
||||
development branch may already contain a fix.
|
||||
|
||||
3. **Isolate the demonstrable problem** — make sure that the code in the
|
||||
project's repository is _definitely_ responsible for the issue. Create a
|
||||
[reduced test case](http://css-tricks.com/6263-reduced-test-cases/) - an
|
||||
extremely simple and immediately viewable example of the issue.
|
||||
|
||||
4. **Include a live example** — provide a link to your reduced test case
|
||||
when appropriate (e.g. if the issue is related to (front-end technologies).
|
||||
Please use [jsFiddle](http://jsfiddle.net) to host examples.
|
||||
|
||||
Please try to be as detailed as possible in your report too. What is your
|
||||
environment? What steps will reproduce the issue? What browser(s) and OS
|
||||
experience the problem? What would you expect to be the outcome? All these
|
||||
details will help people to assess and fix any potential bugs.
|
||||
|
||||
### Example of a good bug report:
|
||||
|
||||
> Short and descriptive title
|
||||
>
|
||||
> A summary of the issue and the browser/OS environment in which it occurs. If
|
||||
> suitable, include the steps required to reproduce the bug.
|
||||
>
|
||||
> 1. This is the first step
|
||||
> 2. This is the second step
|
||||
> 3. Further steps, etc.
|
||||
>
|
||||
> `<url>` (a link to the reduced test case)
|
||||
>
|
||||
> Any other information you want to share that is relevant to the issue being
|
||||
> reported. This might include the lines of code that you have identified as
|
||||
> causing the bug, and potential solutions (and your opinions on their
|
||||
> merits).
|
||||
|
||||
A good bug report shouldn't leave people needing to chase you up to get further
|
||||
information that is required to assess or fix the bug.
|
||||
|
||||
**[File a bug report](https://github.com/h5bp/html5-boilerplate/issues/)**
|
||||
|
||||
|
||||
## Pull requests
|
||||
|
||||
Good pull requests — patches, improvements, new features — are a fantastic
|
||||
help. They should remain focused in scope and avoid containing unrelated
|
||||
commits.
|
||||
|
||||
If your contribution involves a significant amount of work or substantial
|
||||
changes to any part of the project, please open an issue to discuss it first.
|
||||
|
||||
Please follow this process; it's the best way to get your work included in the
|
||||
project:
|
||||
|
||||
1. [Fork](http://help.github.com/fork-a-repo/) the project.
|
||||
|
||||
2. Clone your fork (`git clone
|
||||
https://github.com/<your-username>/html5-boilerplate.git`).
|
||||
|
||||
3. Add an `upstream` remote (`git remote add upstream
|
||||
https://github.com/h5bp/html5-boilerplate.git`).
|
||||
|
||||
4. Get the latest changes from upstream (e.g. `git pull upstream
|
||||
<dev-branch>`).
|
||||
|
||||
5. Create a new topic branch to contain your feature, change, or fix (`git
|
||||
checkout -b <topic-branch-name>`).
|
||||
|
||||
6. Make sure that your changes adhere to the current coding conventions used
|
||||
throughout the project - indentation, accurate comments, etc. Please update
|
||||
any documentation that is relevant to the change you are making.
|
||||
|
||||
7. Commit your changes in logical chunks; use git's [interactive
|
||||
rebase](https://help.github.com/articles/interactive-rebase) feature to tidy
|
||||
up your commits before making them public. Please adhere to these [git commit
|
||||
message
|
||||
guidelines](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
|
||||
or your pull request is unlikely be merged into the main project.
|
||||
|
||||
8. Locally merge (or rebase) the upstream branch into your topic branch.
|
||||
|
||||
9. Push your topic branch up to your fork (`git push origin
|
||||
<topic-branch-name>`).
|
||||
|
||||
10. [Open a Pull Request](http://help.github.com/send-pull-requests/) with a
|
||||
clear title and description. Please mention which browsers you tested in.
|
||||
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# crossdomain.xml
|
||||
|
||||
@@ -14,8 +14,4 @@ custom headers in cross-domain requests, and are also used with sockets to
|
||||
grant permissions for socket-based connections.
|
||||
|
||||
For full details, check out Adobe's article about the [cross-domain policy file
|
||||
specification](http://www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html)
|
||||
|
||||
Read the [Cross-domain policy file
|
||||
specification](http://learn.adobe.com/wiki/download/attachments/64389123/CrossDomain_PolicyFile_Specification.pdf?version=1)
|
||||
- (PDF, 129 KB)
|
||||
specification](http://www.adobe.com/devnet/articles/crossdomain_policy_file_spec.html).
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# The CSS
|
||||
|
||||
@@ -107,8 +107,9 @@ useful when developing mobile wep apps.
|
||||
|
||||
* Print styles are inlined to [reduce the number of page
|
||||
requests](http://www.phpied.com/delay-loading-your-print-css/).
|
||||
* We strip all background colors and change the font color to dark gray and
|
||||
remove text-shadow. This is meant to help save printer ink.
|
||||
* We strip all background colors, change the font color to black and remove
|
||||
text-shadow. This is meant to [help save printer ink and make the printing
|
||||
process much faster](http://www.sanbeiji.com/archives/953).
|
||||
* Anchors do not need colors to indicate they are linked. They are underlined
|
||||
to indicate so.
|
||||
* Anchors and Abbreviations are expanded to indicate where users reading the
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# Extend and customise HTML5 Boilerplate
|
||||
|
||||
@@ -246,6 +246,19 @@ or one of a predefined list of glyphs.
|
||||
<meta name="msapplication-badge" value="frequency=NUMBER_IN_MINUTES;polling-uri=http://www.example.com/path/to/file.xml">
|
||||
```
|
||||
|
||||
### Disable link highlighting upon tap in IE10
|
||||
|
||||
Similar to [-webkit-tap-highlight-color](http://davidwalsh.name/mobile-highlight-color)
|
||||
in iOS Safari. Unlike that CSS property, this is an HTML meta element, and it's
|
||||
value is boolean rather than a color. It's all or nothing.
|
||||
|
||||
```html
|
||||
<meta name="msapplication-tap-highlight" content="no" />
|
||||
```
|
||||
|
||||
You can read about this useful element and more techniques in
|
||||
[Microsoft's documentation on adapting WebKit-oriented apps for IE10](http://blogs.windows.com/windows_phone/b/wpdev/archive/2012/11/15/adapting-your-webkit-optimized-site-for-internet-explorer-10.aspx).
|
||||
|
||||
### Suppress IE6 image toolbar
|
||||
|
||||
Kill IE6's pop-up-on-mouseover toolbar for images that can interfere with
|
||||
@@ -443,12 +456,12 @@ Add this function after `_gaq` is defined:
|
||||
a.href = href;
|
||||
return a;
|
||||
};
|
||||
window.onerror = function (message, file, row) {
|
||||
window.onerror = function (message, file, line, column) {
|
||||
var host = link(file).hostname;
|
||||
_gaq.push([
|
||||
'_trackEvent',
|
||||
(host == window.location.hostname || host == undefined || host == '' ? '' : 'external ') + 'error',
|
||||
message, file + ' LINE: ' + row, undefined, undefined, true
|
||||
message, file + ' LINE: ' + line + (column ? ' COLUMN: ' + column : ''), undefined, undefined, true
|
||||
]);
|
||||
};
|
||||
}(window));
|
||||
@@ -479,6 +492,72 @@ $(function(){
|
||||
});
|
||||
```
|
||||
|
||||
## iOS Web Apps
|
||||
|
||||
There are a couple of meta tags that provide information about a web app when
|
||||
added to the Home Screen on iOS.
|
||||
|
||||
Adding `apple-mobile-web-app-capable` will make your web app chrome-less and
|
||||
provide the default iOS app view. You can control the color scheme of the
|
||||
default view by adding `apple-mobile-web-app-status-bar-style`.
|
||||
|
||||
```html
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
```
|
||||
|
||||
You can use `apple-mobile-web-app-title` to add a specific sites name for the
|
||||
Home Screen icon. This works since iOS 6.
|
||||
|
||||
```html
|
||||
<meta name="apple-mobile-web-app-title" content="">
|
||||
```
|
||||
|
||||
For further information please read the [official documentation](http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html)
|
||||
on Apple's site.
|
||||
|
||||
### Apple Touch Icons
|
||||
|
||||
Touch Icons can be seen as the favicons of mobile devices and tablets.
|
||||
|
||||
If your site or icons are in a sub-directory, you will need to reference the
|
||||
icons using `link` elements placed in the HTML `head` of your document.
|
||||
|
||||
```html
|
||||
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
|
||||
```
|
||||
|
||||
The main sizes of the icons on iOS are:
|
||||
|
||||
* iPad, high-resolution display, iOS 7: 152x152
|
||||
* iPad, high-resolution display, iOS ≤ 6: 144x144
|
||||
* iPhone, high-resolution display, iOS 7: 120x120
|
||||
* iPhone, high-resolution display, iOS ≤ 6: 114x114
|
||||
* iPad, non-Retina, iOS ≤ 6: 72x72
|
||||
|
||||
For non-Retina iPhone, iPod Touch, and Android 2.1+ devices you can use the
|
||||
example from above or replace the `apple-touch-icon-precomposed.png` within this
|
||||
project's root folder.
|
||||
|
||||
Please refer to Mathias' [article on Touch
|
||||
Icons](http://mathiasbynens.be/notes/touch-icons) for a comprehensive overview.
|
||||
|
||||
### Apple Touch Startup Image
|
||||
|
||||
Apart from that it is possible to add start-up screens for web apps on iOS. This
|
||||
basically works by defining `apple-touch-startup-image` with an according link
|
||||
to the image. Since iOS devices have different screen resolutions it is
|
||||
necessary to add media queries to detect which image to load. Here is an
|
||||
example for a retina iPhone:
|
||||
|
||||
```html
|
||||
<link rel="apple-touch-startup-image" media="(max-device-width: 480px) and (-webkit-min-device-pixel-ratio: 2)" href="img/startup-retina.png">
|
||||
```
|
||||
|
||||
However, it is possible to detect which start-up image to use with JavaScript.
|
||||
The Mobile Boilerplate provides a useful function for this. Please see
|
||||
[helpers.js](https://github.com/h5bp/mobile-boilerplate/blob/master/js/helper.js#L354)
|
||||
for the implementation.
|
||||
|
||||
## Miscellaneous
|
||||
|
||||
|
||||
11
doc/faq.md
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# Frequently asked questions
|
||||
|
||||
@@ -12,11 +12,10 @@ URLs](http://paulirish.com/2010/the-protocol-relative-url/)
|
||||
problematic when you try to view your local files directly in the browser. The
|
||||
browser will attempt to fetch the file from your local file system. We
|
||||
recommend that you use a local server to test your pages (or Dropbox). This can
|
||||
be done using Python by running `python -m SimpleHTTPServer` from your local
|
||||
directory, using Ruby by installing and running
|
||||
[asdf](https://rubygems.org/gems/asdf), and by installing any one of XAMPP,
|
||||
MAMP, or WAMP.
|
||||
|
||||
be done using Python 2.x by running `python -m SimpleHTTPServer` or Python 3.x
|
||||
with `python -m http.server` from your local directory, using Ruby by installing
|
||||
and running [asdf](https://rubygems.org/gems/asdf), and by installing any one of
|
||||
XAMPP, MAMP, or WAMP.
|
||||
|
||||
### Why don't you automatically load the latest version of jQuery from the Google CDN?
|
||||
|
||||
|
||||
323
doc/htaccess.md
@@ -1,323 +0,0 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
|
||||
# .htaccess
|
||||
|
||||
In Apache HTTP server, `.htaccess` (hypertext access) is the configuration file
|
||||
that allows for web server configuration. HTML5 Boilerplate includes a number
|
||||
of best practice server rules for making web pages fast and secure, these rules
|
||||
can be applied by configuring `.htaccess` file.
|
||||
|
||||
**You'll want to have these modules enabled for optimum performance:**
|
||||
|
||||
* `mod_setenvif.c` (setenvif_module)
|
||||
* `mod_headers.c` (headers_module)
|
||||
* `mod_deflate.c` (deflate_module)
|
||||
* `mod_filter.c` (filter_module)
|
||||
* `mod_expires.c` (expires_module)
|
||||
* `mod_rewrite.c` (rewrite_module)
|
||||
|
||||
|
||||
## On Windows
|
||||
|
||||
You've got a couple of options that depend on how you installed Apache.
|
||||
|
||||
1. **WampServer**. This is by far the simplest option. If you have installed
|
||||
WampServer just click on the icon in the task bar, hover over the Apache
|
||||
section in the menu that comes up and then hover over the modules section.
|
||||
You will be presented with a list of modules. Simply click on a module name
|
||||
to enable it (or disable it if it is already enabled). A check mark next to
|
||||
a module indicates that it is enabled. WampServer will automatically restart
|
||||
the Apache service after you enable a module.
|
||||
|
||||
2. **Manually editing `httpd.conf`**. This assumes that you have manually
|
||||
installed Apache. You will need to locate the `httpd.conf` file which is
|
||||
normally in the `conf` folder in the folder where you installed Apache (for
|
||||
example `C:\apache\conf\httpd.conf`). Open up this file in a text editor. Near
|
||||
the top (after a bunch of comments) you will see a long list of modules. Check
|
||||
to make sure that the modules listed above are not commented out. If they
|
||||
are, go ahead and uncomment them and restart Apache.
|
||||
|
||||
That's it, you're done!
|
||||
|
||||
|
||||
## On Linux
|
||||
|
||||
These instructions should work on any distribution where `apt-get` has been
|
||||
used to install Apache.
|
||||
|
||||
1. Open up a terminal and type the following command. Enter your password when
|
||||
prompted.
|
||||
|
||||
`sudo a2enmod setenvif headers deflate filter expires rewrite include`
|
||||
|
||||
1. Restart apache by using the following command so the new configuration takes
|
||||
effect.
|
||||
|
||||
`sudo /etc/init.d/apache2 restart`
|
||||
|
||||
That's it, you're done!
|
||||
|
||||
|
||||
## On Mac
|
||||
|
||||
Coming soon...
|
||||
|
||||
|
||||
## Security
|
||||
|
||||
Do not turn off your ServerSignature (i.e., the `Server:` HTTP header). Serious
|
||||
attackers can use other kinds of fingerprinting methods to figure out the
|
||||
actual server and components running behind a port. Instead, as a site owner,
|
||||
you should keep track of what's listening on ports on hosts that you control.
|
||||
Run a periodic scanner to make sure nothing suspicious is running on a host you
|
||||
control, and use the ServerSignature to determine if this is the web server and
|
||||
version that you expect.
|
||||
|
||||
|
||||
## Performance
|
||||
|
||||
### Configure ETags
|
||||
|
||||
```apache
|
||||
FileETag None
|
||||
```
|
||||
|
||||
Entity tags (ETags) is a mechanism that web servers and browsers use to
|
||||
determine whether the component in the browser's cache matches the one on the
|
||||
origin server. (An "entity" is another word a "component": images, scripts,
|
||||
stylesheets, etc.) ETags were added to provide a mechanism for validating
|
||||
entities that is more flexible than the last-modified date. An `ETag` is a
|
||||
string that uniquely identifies a specific version of a component. The only
|
||||
format constraints are that the string be quoted. The origin server specifies
|
||||
the component's `ETag` using the `ETag` response header.
|
||||
|
||||
```http
|
||||
HTTP/1.1 200 OK
|
||||
Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT
|
||||
ETag: "10c24bc-4ab-457e1c1f"
|
||||
Content-Length: 12195
|
||||
```
|
||||
|
||||
Later, if the browser has to validate a component, it uses the `If-None-Match`
|
||||
header to pass the `ETag` back to the origin server. If the ETags match, a 304
|
||||
status code is returned reducing the response by 12195 bytes for this
|
||||
example.
|
||||
|
||||
```http
|
||||
GET /i/yahoo.gif HTTP/1.1
|
||||
Host: us.yimg.com
|
||||
If-Modified-Since: Tue, 12 Dec 2006 03:03:59 GMT
|
||||
If-None-Match: "10c24bc-4ab-457e1c1f"
|
||||
HTTP/1.1 304 Not Modified
|
||||
```
|
||||
|
||||
The problem with ETags is that they typically are constructed using attributes
|
||||
that make them unique to a specific server hosting a site. ETags won't match
|
||||
when a browser gets the original component from one server and later tries to
|
||||
validate that component on a different server, a situation that is all too
|
||||
common on web sites that use a cluster of servers to handle requests. By
|
||||
default, both Apache and IIS embed data in the ETag that dramatically reduces
|
||||
the odds of the validity test succeeding on web sites with multiple servers.
|
||||
|
||||
The ETag format for Apache 1.3 and 2.x is inode-size-timestamp. Although a
|
||||
given file may reside in the same directory across multiple servers, and have
|
||||
the same file size, permissions, timestamp, etc., its inode is different from
|
||||
one server to the next.
|
||||
|
||||
IIS 5.0 and 6.0 have a similar issue with ETags. The format for ETags on IIS is
|
||||
Filetimestamp:ChangeNumber. A ChangeNumber is a counter used to track
|
||||
configuration changes to IIS. It's unlikely that the ChangeNumber is the same
|
||||
across all IIS servers behind a web site.
|
||||
|
||||
The end result is ETags generated by Apache and IIS for the exact same
|
||||
component won't match from one server to another. If the ETags don't match, the
|
||||
user doesn't receive the small, fast 304 response that ETags were designed for;
|
||||
instead, they'll get a normal 200 response along with all the data for the
|
||||
component. If you host your web site on just one server, this isn't a problem.
|
||||
But if you have multiple servers hosting your web site, and you're using Apache
|
||||
or IIS with the default ETag configuration, your users are getting slower
|
||||
pages, your servers have a higher load, you're consuming greater bandwidth, and
|
||||
proxies aren't caching your content efficiently. Even if your components have a
|
||||
far future Expires header, a conditional GET request is still made whenever the
|
||||
user hits Reload or Refresh.
|
||||
|
||||
If you're not taking advantage of the flexible validation model that ETags
|
||||
provide, it's better to just remove the ETag altogether. The Last-Modified
|
||||
header validates based on the component's timestamp. And removing the ETag
|
||||
reduces the size of the HTTP headers in both the response and subsequent
|
||||
requests. This Microsoft Support article describes how to remove ETags. In
|
||||
Apache, this is done by simply adding the above line to your Apache
|
||||
configuration file.
|
||||
|
||||
|
||||
### Gzip Components
|
||||
|
||||
Compression reduces response times by reducing the size of the HTTP response.
|
||||
|
||||
Starting with HTTP/1.1, web clients indicate support for compression with the
|
||||
Accept-Encoding header in the HTTP request.
|
||||
|
||||
```
|
||||
Accept-Encoding: gzip, deflate
|
||||
```
|
||||
|
||||
If the web server sees this header in the request, it may compress the response
|
||||
using one of the methods listed by the client. The web server notifies the web
|
||||
client of this via the Content-Encoding header in the response.
|
||||
|
||||
```
|
||||
Content-Encoding: gzip
|
||||
```
|
||||
|
||||
Gzip is the most popular and effective compression method at this time. It was
|
||||
developed by the GNU project and standardized by RFC 1952. The only other
|
||||
compression format you're likely to see is deflate, but it's less effective and
|
||||
less popular.
|
||||
|
||||
Gzipping generally reduces the response size by about 70%. Approximately 90% of
|
||||
today's Internet traffic travels through browsers that claim to support gzip.
|
||||
If you use Apache, the module configuring gzip depends on your version: Apache
|
||||
1.3 uses `mod_gzip` while Apache 2.x uses `mod_deflate`.
|
||||
|
||||
There are known issues with browsers and proxies that may cause a mismatch in
|
||||
what the browser expects and what it receives with regard to compressed
|
||||
content. Fortunately, these edge cases are dwindling as the use of older
|
||||
browsers drops off. The Apache modules help out by adding appropriate Vary
|
||||
response headers automatically.
|
||||
|
||||
Servers choose what to gzip based on file type, but are typically too limited
|
||||
in what they decide to compress. Most web sites gzip their HTML documents. It's
|
||||
also worthwhile to gzip your scripts and stylesheets, but many web sites miss
|
||||
this opportunity. In fact, it's worthwhile to compress any text response
|
||||
including XML and JSON. Image and PDF files should not be gzipped because they
|
||||
are already compressed. Trying to gzip them not only wastes CPU but can
|
||||
potentially increase file sizes.
|
||||
|
||||
Gzipping as many appropriate file types as possible is an easy way to reduce
|
||||
page weight and accelerate the user experience.
|
||||
|
||||
|
||||
### Cache busting
|
||||
|
||||
A first-time visitor to your page may have to make several HTTP requests, but
|
||||
by using the Expires header you make those components cacheable. This avoids
|
||||
unnecessary HTTP requests on subsequent page views. Expires headers are most
|
||||
often used with images, but they should be used on all components including
|
||||
scripts, stylesheets, etc.
|
||||
|
||||
Traditionally, if you use a far future Expires header you have to change the
|
||||
component's filename whenever the component changes.
|
||||
|
||||
The H5BP `.htaccess` has built-in filename cache busting. To use it, uncomment
|
||||
the relevant lines in the `.htaccess` file.
|
||||
|
||||
Doing so will route all requests for `/path/filename.20120101.ext` to
|
||||
`/path/filename.ext`. To use this, just add a time-stamp number (or your own
|
||||
numbered versioning system) into your resource filenames in your HTML source
|
||||
whenever you update those resources.
|
||||
|
||||
#### Example:
|
||||
|
||||
```html
|
||||
<script src="/js/myscript.20120305.js"></script>
|
||||
<script src="/js/jqueryplugin.45.js"></script>
|
||||
<link rel="stylesheet" href="css/somestyle.49559939932.css">
|
||||
<link rel="stylesheet" href="css/anotherstyle.2.css">
|
||||
```
|
||||
|
||||
**N.B. You do not have to rename the resource on the filesystem.** All you have
|
||||
to do is add the timestamp number to the filename in your HTML source. The
|
||||
`.htaccess` directive will serve up the proper file.
|
||||
|
||||
Traditional cache busting involved adding a query string to the end of your
|
||||
JavaScript or CSS filename whenever you updated it.
|
||||
|
||||
```html
|
||||
<script src="/js/all.js?v=12"></script>
|
||||
```
|
||||
|
||||
However, as [Steve Souders](http://stevesouders.com/) explains in [*Revving
|
||||
Filenames: don’t use
|
||||
querystring*](http://www.stevesouders.com/blog/2008/08/23/revving-filenames-dont-use-querystring/),
|
||||
the query string approach is not always reliable for clients behind a Squid
|
||||
Proxy Server.
|
||||
|
||||
|
||||
## Trailing slash redirects
|
||||
|
||||
Trailing slash redirects can be done by adding one of the options below in `.htaccess`.
|
||||
|
||||
### Option 1
|
||||
Rewrite `domain.com/foo` -> `domain.com/foo/`.
|
||||
|
||||
```apache
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
|
||||
RewriteRule ^(.*)$ $1/ [R=301,L]
|
||||
```
|
||||
|
||||
### Option 2
|
||||
Rewrite `domain.com/foo/` -> `domain.com/foo`
|
||||
|
||||
```apache
|
||||
RewriteRule ^(.*)/$ $1 [R=301,L]
|
||||
```
|
||||
|
||||
Here are some tips to show you how to integrate the rewrite rules with
|
||||
different CMS tools. There are four areas you need to look out for:
|
||||
|
||||
### 1. Keep a backup
|
||||
|
||||
If you use trailing slash redirects on an existing site, always keep a backup
|
||||
of your `.htaccess` and test thoroughly on your staging server before using it on
|
||||
a production server.
|
||||
|
||||
### 2. Don't replace existing rules, merge
|
||||
|
||||
For example, if you use CodeIgniter you may have existing URL rewrite rules like:
|
||||
|
||||
```apache
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_FILENAME} !-d
|
||||
RewriteRule ^(.*)$ index.php/$1
|
||||
```
|
||||
|
||||
Merge the above with H5BP rules below:
|
||||
|
||||
```apache
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
|
||||
RewriteRule ^(.*)$ $1/ [R=301,L]
|
||||
```
|
||||
|
||||
### 3. Be careful of the order
|
||||
|
||||
Make sure you test thoroughly in your staging environment. For the above
|
||||
example, the order is add trailing slash first, and add your existing rule
|
||||
after:
|
||||
|
||||
```apache
|
||||
# this adds trailing slash
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_URI} !(\.[a-zA-Z0-9]{1,5}|/|#(.*))$
|
||||
RewriteRule ^(.*)$ $1/ [R=301,L]
|
||||
|
||||
# this gets rid of index.php
|
||||
RewriteCond %{REQUEST_FILENAME} !-f
|
||||
RewriteCond %{REQUEST_FILENAME} !-d
|
||||
RewriteRule ^(.*)$ index.php/$1
|
||||
```
|
||||
|
||||
### 4. Double-check `RewriteBase` path is correct
|
||||
|
||||
Make sure your `RewriteBase` path points to the correct location and sits above
|
||||
any rewrite rules. This usually happens to those have WordPress and ran the
|
||||
auto install. For instance, if you have a site at `example.com/blog`, your
|
||||
RewriteBase may look like:
|
||||
|
||||
```apache
|
||||
RewriteBase /blog/
|
||||
```
|
||||
|
||||
If you already have a working RewriteBase, keep that and don't remove it.
|
||||
39
doc/html.md
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# The HTML
|
||||
|
||||
@@ -38,8 +38,8 @@ spec](http://www.whatwg.org/specs/web-apps/current-work/complete/semantics.html#
|
||||
(4.2.5.5 Specifying the document's character encoding), add your charset
|
||||
declaration early (before any ASCII art ;) to avoid a potential
|
||||
[encoding-related security
|
||||
issue](http://code.google.com/p/doctype/wiki/ArticleUtf7) in IE. It should come
|
||||
in the first [1024
|
||||
issue](http://code.google.com/p/doctype-mirror/wiki/ArticleUtf7) in IE. It
|
||||
should come in the first [1024
|
||||
bytes](http://www.whatwg.org/specs/web-apps/current-work/multipage/semantics.html#charset).
|
||||
|
||||
The charset should also come before the `<title>` tag, due to [potential XSS
|
||||
@@ -60,21 +60,17 @@ possible that they're not using the latest rendering engine their browser
|
||||
contains. To fix this, use:
|
||||
|
||||
```html
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
```
|
||||
|
||||
The `meta` tag tells the IE rendering engine two things:
|
||||
|
||||
1. It should use the latest, or edge, version of the IE rendering environment
|
||||
2. If already installed, it should use the Google Chrome Frame rendering
|
||||
engine.
|
||||
The `meta` tag tells the IE rendering engine it should use the latest, or edge,
|
||||
version of the IE rendering environment.
|
||||
|
||||
This `meta` tag ensures that anyone browsing your site in IE is treated to the
|
||||
best possible user experience that their browser can offer.
|
||||
|
||||
This line breaks validation, and the Google Chrome Frame part won't work inside
|
||||
a conditional comment. To avoid these edge case issues it is recommended that
|
||||
you **remove this line and use the `.htaccess`** (or other server config)
|
||||
This line breaks validation. To avoid this edge case issue it is recommended
|
||||
that you **remove this line and use the `.htaccess`** (or other server config)
|
||||
to send these headers instead. You also might want to read [Validating:
|
||||
X-UA-Compatible](http://groups.google.com/group/html5boilerplate/browse_thread/thread/6d1b6b152aca8ed2).
|
||||
|
||||
@@ -92,22 +88,17 @@ Apple developer docs](http://j.mp/mobileviewport). HTML5 Boilerplate comes with
|
||||
a simple setup that strikes a good balance for general use cases.
|
||||
|
||||
```html
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
```
|
||||
|
||||
## Favicons and Touch Icons
|
||||
## Favicons and Touch Icon
|
||||
|
||||
The shortcut icons should be put in the root directory of your site. HTML5
|
||||
Boilerplate comes with a default set of icons (include favicon and Apple Touch
|
||||
Icons) that you can use as a baseline to create your own.
|
||||
|
||||
If your site or icons are in a sub-directory, you will need to reference the
|
||||
icons using `link` elements placed in the HTML `head` of your document.
|
||||
|
||||
For a comprehensive overview, please read [Everything you always wanted to know
|
||||
about touch icons](http://mathiasbynens.be/notes/touch-icons) by Mathias
|
||||
Bynens.
|
||||
Boilerplate comes with a default set of icons (include favicon and one Apple
|
||||
Touch Icon) that you can use as a baseline to create your own.
|
||||
|
||||
Please refer to the more detailed description in the [Extend section](extend.md)
|
||||
of these docs.
|
||||
|
||||
## Modernizr
|
||||
|
||||
@@ -144,7 +135,7 @@ you intended to support IE 6, then you should remove the snippet of code.
|
||||
|
||||
The Google CDN version of the jQuery JavaScript library is referenced towards
|
||||
the bottom of the page using a protocol-independent path (read more about this
|
||||
in the [FAQ](faq.md). A local fallback of jQuery is included for rare instances
|
||||
in the [FAQ](faq.md)). A local fallback of jQuery is included for rare instances
|
||||
when the CDN version might not be available, and to facilitate offline
|
||||
development.
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# The JavaScript
|
||||
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation table of contents](README.md)
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](TOC.md)
|
||||
|
||||
# Miscellaneous
|
||||
|
||||
|
||||
28
doc/usage.md
@@ -1,5 +1,5 @@
|
||||
[HTML5 Boilerplate homepage](http://html5boilerplate.com) | [Documentation
|
||||
table of contents](README.md)
|
||||
table of contents](TOC.md)
|
||||
|
||||
# Usage
|
||||
|
||||
@@ -34,12 +34,12 @@ A basic HTML5 Boilerplate site initially looks something like this:
|
||||
│ └── modernizr.min.js
|
||||
├── .htaccess
|
||||
├── 404.html
|
||||
├── apple-touch-icon-precomposed.png
|
||||
├── index.html
|
||||
├── humans.txt
|
||||
├── robots.txt
|
||||
├── crossdomain.xml
|
||||
├── favicon.ico
|
||||
└── [apple-touch-icons]
|
||||
└── favicon.ico
|
||||
```
|
||||
|
||||
What follows is a general overview of each major part and how to use them.
|
||||
@@ -63,13 +63,13 @@ get you started. [About the JavaScript](js.md).
|
||||
|
||||
### .htaccess
|
||||
|
||||
The default web server config is for Apache. [About the .htaccess](htaccess.md).
|
||||
The default web server configs are for Apache. For more information, please
|
||||
refer to the [Apache Server Configs
|
||||
documentation](https://github.com/h5bp/server-configs-apache/tree/master/doc).
|
||||
|
||||
Host your site on a server other than Apache? You're likely to find the
|
||||
corresponding configuration file in our [server configs
|
||||
repo](https://github.com/h5bp/server-configs). If you cannot find a
|
||||
configuration file for your setup, please consider contributing one so that
|
||||
others can benefit too.
|
||||
corresponding server configs project listed in our [Server Configs
|
||||
](https://github.com/h5bp/server-configs/blob/master/README.md) repository.
|
||||
|
||||
### 404.html
|
||||
|
||||
@@ -101,9 +101,13 @@ Edit this file to include any pages you need hidden from search engines.
|
||||
A template for working with cross-domain requests. [About
|
||||
crossdomain.xml](crossdomain.md).
|
||||
|
||||
### icons
|
||||
### Icons
|
||||
|
||||
Replace the default `favicon.ico` and apple touch icons with your own. You
|
||||
might want to check out Hans Christian's handy [HTML5 Boilerplate Favicon and
|
||||
Apple Touch Icon
|
||||
Replace the default `favicon.ico` and Apple Touch Icon with your own.
|
||||
|
||||
If you want to use different Apple Touch Icons for different resolutions please
|
||||
refer to the [according documentation](extend.md#apple-touch-icons).
|
||||
|
||||
You might want to check out Hans' handy [HTML5 Boilerplate Favicon and Apple
|
||||
Touch Icon
|
||||
PSD-Template](http://drublic.de/blog/html5-boilerplate-favicons-psd-template/).
|
||||
|
||||
BIN
favicon.ico
|
Before Width: | Height: | Size: 318 B After Width: | Height: | Size: 766 B |
@@ -12,4 +12,4 @@
|
||||
# TECHNOLOGY COLOPHON
|
||||
|
||||
HTML5, CSS3
|
||||
jQuery, Modernizr
|
||||
Normalize.css, jQuery, Modernizr
|
||||
|
||||
22
index.html
@@ -5,36 +5,38 @@
|
||||
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<title></title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
|
||||
|
||||
<link rel="stylesheet" href="css/normalize.css">
|
||||
<link rel="stylesheet" href="css/main.css">
|
||||
<script src="js/vendor/modernizr-2.6.1.min.js"></script>
|
||||
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!--[if lt IE 7]>
|
||||
<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
|
||||
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<!-- Add your site or application content here -->
|
||||
<p>Hello world! This is HTML5 Boilerplate.</p>
|
||||
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.8.0.min.js"><\/script>')</script>
|
||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
|
||||
<script src="js/plugins.js"></script>
|
||||
<script src="js/main.js"></script>
|
||||
|
||||
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
|
||||
<script>
|
||||
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
|
||||
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
|
||||
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
|
||||
s.parentNode.insertBefore(g,s)}(document,'script'));
|
||||
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
|
||||
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
|
||||
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
|
||||
e.src='//www.google-analytics.com/analytics.js';
|
||||
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
|
||||
ga('create','UA-XXXXX-X');ga('send','pageview');
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,14 +1,24 @@
|
||||
// Avoid `console` errors in browsers that lack a console.
|
||||
if (!(window.console && console.log)) {
|
||||
(function() {
|
||||
var noop = function() {};
|
||||
var methods = ['assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error', 'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log', 'markTimeline', 'profile', 'profileEnd', 'markTimeline', 'table', 'time', 'timeEnd', 'timeStamp', 'trace', 'warn'];
|
||||
var length = methods.length;
|
||||
var console = window.console = {};
|
||||
while (length--) {
|
||||
console[methods[length]] = noop;
|
||||
(function() {
|
||||
var method;
|
||||
var noop = function () {};
|
||||
var methods = [
|
||||
'assert', 'clear', 'count', 'debug', 'dir', 'dirxml', 'error',
|
||||
'exception', 'group', 'groupCollapsed', 'groupEnd', 'info', 'log',
|
||||
'markTimeline', 'profile', 'profileEnd', 'table', 'time', 'timeEnd',
|
||||
'timeStamp', 'trace', 'warn'
|
||||
];
|
||||
var length = methods.length;
|
||||
var console = (window.console = window.console || {});
|
||||
|
||||
while (length--) {
|
||||
method = methods[length];
|
||||
|
||||
// Only stub undefined methods.
|
||||
if (!console[method]) {
|
||||
console[method] = noop;
|
||||
}
|
||||
}());
|
||||
}
|
||||
}
|
||||
}());
|
||||
|
||||
// Place any jQuery/helper plugins in here.
|
||||
|
||||