-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
123 lines (120 loc) · 5.72 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
<!-- HTML5 Sandbox -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Index | HTML5 Sandbox</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/normalize.css">
<script src="js/script.js"></script>
</head>
<body>
<header>
<!-- Sectioning element "page-header" -->
<h1>Simple <span>HTML5</span> page</h1>
</header>
<nav>
<!-- Sectioning element "page-navigation" -->
<header>
<h1>Main navigation</h1>
</header>
<ul>
<li><a href="headings.html">Headings</a></li>
<li><a href="summaryDetail.html">Summary & Detail</a></li>
<li><a href="time.html">Time</a></li>
<li><a href="translate.html">Translate</a></li>
<li><a href="mark.html">Mark</a></li>
<li><a href="microdata.html">Microdata</a></li>
</ul>
</nav>
<section>
<!-- Sectioning element "page-section" -->
<header>
<h1>Section title</h1>
</header>
<article id="long">
<!-- Sectioning element "section-article" -->
<header>
<!-- Sectioning element "article-header" -->
<h1>This is an article title</h1> Here is an intro of the article with a <a href="#">link</a>
</header>
<nav id="secondary">
<!-- Sectioning element "article-nav" -->
<header>
<h1>Secondary nav title</h1>
</header>
<ul>
<li><a href="...">Next post</a></li>
<li><a href="...">Previous post</a></li>
<li><a href="...">Contact author</a></li>
</ul>
</nav>
<section id="long-part1">
<!-- Sectioning element "article-section" -->
<h2>This is part 1 of the article</h2>
<p>Eum no esse facete instructior. Per singulis quaestio voluptatibus cu, vero mnesarchum honestatis mel cu, pri posse commune id. Ei saepe facilisis maluisset eos. Ut sea corpora ocurreret deterruisset, at adipisci postulant tincidunt mea.</p>
</section>
<figure>
<img src=" http://placehold.it/2000x1500" alt="Example of HTML5 structural tags" />
<figcaption>This is the caption for the figure or image.</figcaption>
</figure>
<section id="long-part2">
<!-- Sectioning element "article-section" -->
<h2>This is part 2 of the article</h2>
<p>Audire fabulas recusabo vix ut. Ut case sale reque nam, at sea meis minim semper. Vitae fabellas theophrastus vix in, magna tation facilisis has ad, ex cum omnis sententiae. Vix et populo malorum, te nisl commodo aliquid sit. Eum ea scripta veritus, inani assueverit no est. Et pri regione abhorreant. Sed ut fabulas accusamus, pri tamquam dissentiet eu.</p>
</section>
<section id="long-part3">
<!-- Sectioning element "article-section" -->
<h2>This is part 3 of the article</h2>
<p>Ex periculis contentiones eum. Ne debet delicata vel, et dicat utinam est, duis quaeque nec ea. Pri te vocibus inimicus disputationi, sed prodesset voluptaria ei, ea vis option dissentias. Est ne soluta altera probatus, ius ornatus efficiendi ex. Ad vel graece eleifend antiopam, ei vis ludus imperdiet, ea sea quaestio recteque disputationi.</p>
</section>
<footer>
<!-- Sectioning element "article-footer" -->
<p>Posted by Author,
<time datetime="2012-02-02">February 2, 2012
</time>
</p>
</footer>
</article>
<article>
<!-- Sectioning element "section-article" -->
<header>
<h1>This is an article title</h1> Here is an intro of the article with a <a href="#">link</a>
</header>
<p>Eum no esse facete instructior. Per singulis quaestio voluptatibus cu, vero mnesarchum honestatis mel cu, pri posse commune id. Ei saepe facilisis maluisset eos. Ut sea corpora ocurreret deterruisset, at adipisci postulant tincidunt mea.</p>
<figure>
<img src=" http://placehold.it/2000x1500" alt="Example of HTML5 structural tags" />
<figcaption>This is the caption for the figure or image.</figcaption>
</figure>
</article>
<article>
<header>
<h1>This is an article title</h1> Here is an intro of the article with a <a href="#">link</a>
</header>
<p>Eum no esse facete instructior. Per singulis quaestio voluptatibus cu, vero mnesarchum honestatis mel cu, pri posse commune id. Ei saepe facilisis maluisset eos. Ut sea corpora ocurreret deterruisset, at adipisci postulant tincidunt mea.</p>
<figure>
<img src=" http://placehold.it/2000x1500" alt="Example of HTML5 structural tags" />
<figcaption>This is the caption for the figure or image.</figcaption>
</figure>
</article>
</section>
<aside>
<h1>
<a href="javascript:(function(){...});"
title="TableDeMatiere">
Click here for displaying the table of contents!
</a>
</h1>
<h1>Tags</h1>
<ul class="tag-cloud">
<li><a href="" rel="tag" class="w2">user</a></li>
<li><a href="" rel="tag" class="w8">design</a></li>
<li><a href="" rel="tag" class="w3">color</a></li>
<li><a href="" rel="tag" class="w5">form</a></li>
</ul>
</aside>
<footer>
<p>2015 Simple HTML5 page</p>
</footer>
</body>
</html>