FileNav

online
online: /HTML & CSS/HTML5_Notes.md

HTML5 Notes

HTML5 Cross Browser Polyfills

Minimal HTML5 Doc

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8" />
        <title>Example document</title>
    </head>
    <body>
        <p>Example paragraph</p>
    </body>
</html>

HTML5 Mobile

Safari Web Content Guide: Configuring the Viewport

Links

GUIDE TO HTML5 HICCUPS

HTML5 Element Notes

article

<article>
    <header>Article Header</header>
    <p>Content</p>
    <footer>&copy 2012</footer>
</article>

aside

Contained by article, section or other content flow.

<article>
    <p>Main content...</p>
    <aside>Content related to but not a part of the main article content</aside>
</article>

audio

<audio src="..." autobuffer autoplay controls></audio>

canvas

<canvas width="1920" height="1080"></canvas>

details

<details open>
    <summery>Detail Summery</summery>
    The rest of the content shown when `open`.
</details>

figure

<figure>
    <dt>Figure Caption</dt>
    <dd>
        <img src="..." alt="graphic"/>
        Figure data/info
    </dd>
</figure>

footer

Contained by document, article or section

header

hgroup

<header>
    <hgroup>
        <h1>Major Heading</h1>
        <h2>Subheading</h2>
    </hgroup>
    <h3>Tagline</h3>
</header>

mark

Text mark or highlight.

meter

<meter min="0" max="100" value="40">40%</meter>

nav

<nav>
    <ul>
        <li><a href="/">Home</a></li>
        <li><a href="/about.html">About</a></li>
    </ul>
</nav>

output

<form id="user_calc">
    <input type="text" value="calculation" value="30" />
</form>
<output form="user_calc" for="calculation" name="total"></output>

progress

<progress max="1" value=".69">69%</progress>

section

A thematic grouping of content such as a chapter.

source

Used within audio or video elements to denote multiple source options.

<audio>
    <source type="audio/ogg" src="quotes.ogg"></source>
    <source type="audio/mp3" src="quotes.mp3"></source>
</audio>

time

<time datetime="2012-03-24T01:55-08:00" pubdate>March 24th 2012 1:55am</time>

video

<video width="1920" height="1080" poster="video.jpg" autobuffer autoplay controls loop>
    <source type="video/ogg" src="video.ogv"></source>
    <source type="video/mp4" src="video.mp4"></source>
</video>

APEX

Links