library-mirrors/normalize.css
1
0
Fork 0
mirror of https://github.com/necolas/normalize.css.git synced 2024-12-25 15:14:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updated demo.html

Browse Source
This commit is contained in:
Jonathan 2011-05-03 14:34:55 -07:00
parent 57fd8879f5
commit 2c8c7aaba8
1 changed files with 225 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

225
demo.html Normal file
View File

@ -0,0 +1,225 @@
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="target-densitydpi=160dpi, width=device-width, minimum-scale=1.0, maximum-scale=1.0">
<title>Normalize CSS</title>
<link rel="stylesheet" href="normalize.css" />
<link rel="stylesheet" href="normalize.metrics.css" />
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
</head>
<body>
<header>
<hgroup>
<h1>
Header Group Heading 1
</h1>
<h2>
Header Group Heading 2
</h2>
</hgroup>
<nav>
<ul>
<li>
First Page
</li>
<li>
Second Page
</li>
<li>
Third Page
</li>
<li>
Last Page
</li>
</ul>
</nav>
</header>
<section>
<h1>
Section Heading 1
</h1>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.
</p>
<p>
Agnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat ma.
</p>
<h2>
Section Heading 2
</h2>
<p>
Agnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat ma.
</p>
<h3>
Section Heading 3
</h3>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.
</p>
</section>
<article>
<h4>
Article Heading 4
</h4>
<p>
Agnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat ma.
</p>
<h5>
Article Heading 5
</h5>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.
</p>
<h6>
Article Heading 6
</h6>
<p>
Agnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat ma.
</p>
</article>
<ol>
<li>
Sed ut perspiciatis unde
</li>
<li>
omnis iste natus error
</li>
<li>
sit voluptatem accusantium
</li>
</ol>
<ul>
<li>
doloremque laudantium
</li>
<li>
totam rem aperiam eaque
</li>
<li>
ipsa quae ab illo
</li>
</ul>
<dl>
<dt>
Definition list term #1
</dt>
<dd>
Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</dd>
<dt>
Definition list term #2
</dt>
<dd>
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
</dd>
</dl>
<nav>
<ul>
<li>
<a href="#">navigation item #1</a>
</li>
<li>
<a href="#">navigation item #2</a>
</li>
<li>
<a href="#">navigation item #3</a>
</li>
</ul>
</nav>
<pre>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et m.</pre>
<div class="spacer"></div>
<p>
<cite>Confucius, The Confucian Cite</cite>, (551 BC - 479 BC)
</p>
<table summary="Jimi Hendrix albums">
<caption>
Jimi Hendrix - albums
</caption>
<thead>
<tr>
<th>Album</th>
<th>Year</th>
<th>Price</th>
</tr>
</thead>
<tfoot>
<tr>
<th>Album</th>
<th>Year</th>
<th>Price</th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Are You Experienced</td>
<td>1967</td>
<td>$10.00</td>
</tr>
<tr>
<td>Axis: Bold as Love</td>
<td>1967</td>
<td>$12.00</td>
</tr>
<tr>
<td>Electric Ladyland</td>
<td>1968</td>
<td>$10.00</td>
</tr>
<tr>
<td>Band of Gypsys</td>
<td>1970</td>
<td>$12.00</td>
</tr>
</tbody>
</table>
<p>
Lorem ipsum dolor <a href="#">a element</a> sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur <abbr title="Title text">abbr element</abbr> adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor <b>b element</b> sit amet, consectetur <i>i element</i> adipisicing elit, sed <s>s element</s> do eiusmod tempor <u>u element</u> incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor <code>code element</code> sit amet, consectetur <kbd>kbd element</kbd> adipisicing elit, sed <samp>samp element</samp> do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur <strong>strong element</strong> adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor <cite>cite element</cite> sit amet, consectetur <dfn>dfn element</dfn> adipisicing elit, sed <em>em element</em> do eiusmod tempor <q>q element</q> incididunt ut labore <var>var element</var> et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur <del>del element</del> adipisicing elit, sed <strike>strike element</strike> do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur <ins>ins element</ins> adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed <sub>sub element</sub> do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore <sup>sup element</sup> et dolore magna aliqua.
</p>
</body>
</html>