forked from ld-web/studi-html-css
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
172 lines (170 loc) · 9.08 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
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<html lang="fr">
<head>
<title>STUDI HTML/CSS</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<!-- Liens HTML -->
<a href="#contact">Contact</a>
<a href="page.html#important">Important : voir</a>
<!-- Suite de titres par ordre d'importance -->
<h1>Studi</h1>
<h2>Coucou</h2>
<h3>Coucou</h3>
<!-- Image -->
<img src="img/dev_tools.png" alt="Google Chrome Development tools" />
<h4>Coucou</h4>
<h5>Coucou</h5>
<h6>Coucou</h6>
<!-- Lien HTML = ancre (anchor) -->
<a href="https://google.com" target="_blank">Google</a>
<!-- Paragraphe -->
<p class="important red">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Iste, quidem
voluptatem? Obcaecati a distinctio ullam quisquam? Voluptate laudantium
sunt repudiandae deserunt rerum voluptatem obcaecati nobis, repellat
voluptas laboriosam ut consequatur ea placeat laborum blanditiis autem
quis, reiciendis dignissimos debitis in! Ullam provident optio, rem
aliquid placeat corrupti nam. Adipisci illo dicta id molestiae! Vel enim
nisi dolorum cumque labore facilis!
<br />
Pariatur perspiciatis maxime cupiditate, facere illo at eum explicabo nemo
et veritatis! Minus, deserunt omnis, commodi, ipsa odit facilis recusandae
assumenda in consequuntur animi illum ducimus accusamus itaque asperiores!
Numquam molestias aspernatur tenetur blanditiis provident facilis aliquid
repudiandae rerum voluptates.
</p>
<p>
Lorem ipsum dolor sit amet consectetur, adipisicing elit. Qui aut tempora
repellat neque dolorem dolorum vitae dicta, modi eius placeat dignissimos
nemo culpa quibusdam quos fugiat dolor sequi quasi eos molestias aliquam
debitis! Asperiores distinctio aliquam temporibus voluptates harum
laudantium eum placeat dolor enim ullam dignissimos corporis ab assumenda
labore atque culpa magnam at voluptatum, amet voluptatem. Eius officiis
delectus cupiditate eligendi autem. Eaque facilis quibusdam fuga iure
consectetur labore molestias iste veniam tempore sint beatae fugit quis ea
id voluptatibus commodi quo minima recusandae deleniti incidunt, qui
excepturi molestiae eos quasi? Accusamus illum voluptate sint vel ullam
sit nam! Laborum voluptatibus quaerat delectus ex quos perferendis ipsam a
magnam quidem ab odit ducimus natus, voluptates sunt voluptatem cum,
voluptas neque eos? A pariatur, obcaecati, molestiae impedit autem
quibusdam veritatis rerum placeat natus esse unde repellendus repellat
ipsam incidunt consequuntur et dolor neque provident, deserunt explicabo
vero. Vel debitis incidunt distinctio dolore, molestiae quos labore dolor.
Eum ratione sit possimus, placeat adipisci, vel voluptas corrupti
molestiae repellat modi a asperiores doloremque doloribus mollitia velit
minima cum, consequatur nobis! Esse consequuntur quis suscipit totam
officiis cumque repellendus, cum aperiam ea facilis nostrum consectetur
nisi inventore blanditiis culpa voluptas sed velit iure?
</p>
<p class="important">
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Similique soluta
quos in adipisci odio necessitatibus alias numquam eligendi distinctio
minima accusamus eaque beatae, officiis pariatur voluptate quaerat sed et
quidem molestias voluptatum voluptas asperiores error dolorem veritatis!
Incidunt fuga nulla consequatur ipsum laborum, debitis voluptate inventore
assumenda maxime? Quidem ut eum maxime numquam vitae blanditiis quaerat,
fugit dolore vero illo laudantium, similique quibusdam in voluptatum eos
corrupti dignissimos. Laudantium repellendus, assumenda quasi cumque fuga
architecto rem? Inventore quod qui nesciunt iste, dolor minus eius, vel
adipisci quasi at explicabo quaerat expedita quam consequatur! Amet nemo
doloribus exercitationem enim pariatur laborum, voluptate numquam possimus
commodi maxime delectus et incidunt deserunt officia obcaecati similique
ipsum, provident placeat a natus excepturi. Tempora numquam illo hic
expedita iste minima exercitationem mollitia dolorem placeat perferendis
quae debitis nam obcaecati libero repudiandae aut, laborum porro delectus
iure. Doloremque ducimus obcaecati quae dolorum fugiat cupiditate ipsum
maxime?
</p>
<p id="contact" class="red">
Nostrum, nobis iure? Velit similique dolorem, sapiente porro omnis nisi
provident quos! Quam quasi ipsa numquam quae nam officiis dolores officia.
Officiis earum sequi corporis similique debitis expedita excepturi quasi,
quisquam natus atque veniam fugit alias temporibus enim exercitationem
perferendis porro laboriosam aut maiores cum nemo aperiam! Ipsam explicabo
doloremque a ab iusto reprehenderit suscipit soluta quo maxime qui, dolor
deserunt officia consequatur, inventore deleniti molestiae nostrum
repudiandae illo! Architecto corporis suscipit consequuntur? Quae
praesentium temporibus sapiente repudiandae tempora! Quod, vero
perferendis. Fugit blanditiis inventore, voluptatum similique quos quasi
eos in itaque minima laborum earum optio totam tenetur culpa illum nulla,
aspernatur ratione neque recusandae! Assumenda eveniet molestiae
laudantium dignissimos, dolor enim ut cumque nostrum. Sint vel vero velit
ratione unde autem odit nulla molestiae ad, possimus numquam nam voluptate
quod ipsam perferendis modi aut ut rem amet. Magnam enim maxime suscipit
eum in blanditiis doloremque velit perspiciatis fuga expedita.
</p>
<p id="info">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Commodi dolores
nulla eos aliquid voluptate obcaecati aperiam quae asperiores totam
facilis. Explicabo quibusdam id ex dicta, sequi architecto qui porro
minima molestiae non voluptatum commodi esse. Ipsum omnis excepturi,
corrupti eum consectetur fugiat inventore at eius hic tenetur minus
pariatur nobis illum dolor! Iusto incidunt fugit placeat iste sapiente,
quos perferendis maiores quia blanditiis ducimus quo illum commodi hic
quam magnam distinctio! Repellendus id atque, reiciendis iste temporibus
cum ea suscipit! Laudantium sint doloremque, ea dignissimos velit
doloribus illum aliquid quasi eum accusantium rem eius dicta error neque
sequi iusto sapiente?
</p>
<p>
Laboriosam porro animi deleniti, aut quas molestiae nobis illum nulla
nesciunt esse corporis iure maiores voluptatum amet? Deserunt temporibus
eveniet amet dolorem maxime ipsa dolores incidunt, voluptatum quasi
expedita, illum assumenda nesciunt aliquid sint autem vero! Et, porro
harum voluptatem maxime rerum, saepe iste provident, officia numquam
suscipit inventore asperiores. Fugiat sapiente quos incidunt quas
consequatur blanditiis qui perferendis nemo ea in esse laboriosam, ipsam
voluptatibus suscipit cum eum maxime quisquam animi ex quidem alias!
Illum, explicabo? Id porro laboriosam nesciunt atque ex asperiores et
magnam nisi totam tempore suscipit impedit sed iure facilis, tenetur quam
molestias illo, iusto commodi.
</p>
<!-- Division de contenu -->
<div>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Fugiat,
architecto debitis. Neque saepe natus culpa sapiente, rerum non expedita
voluptas adipisci asperiores deleniti molestias sequi quos laborum
aspernatur suscipit totam! Dolorem molestias qui, ab, possimus assumenda
quibusdam beatae adipisci ex quidem veritatis soluta dolores doloribus
asperiores! Quibusdam voluptas sequi sapiente qui quisquam sint velit
reprehenderit. Consequatur at fuga ducimus natus amet voluptates sapiente
illo quas sed, alias iste accusamus. Quidem veritatis fugiat quis
necessitatibus labore dolor debitis eos, aliquid qui quod quasi at modi
porro totam facilis minima error, illum maiores culpa sint architecto
doloremque recusandae in laboriosam. Harum cum dolor, eos earum corporis
reiciendis saepe optio enim nisi nihil ab et sint animi nulla perspiciatis
in porro tenetur accusamus eius quo, aspernatur beatae quibusdam esse!
Voluptatibus sequi nemo, expedita ab ducimus fugiat, sit labore animi iste
consequatur mollitia suscipit veniam, harum porro neque? Et, fuga
voluptatum voluptate dolor laborum nam tempore, eaque quas, ad accusamus
assumenda quia! Hic at illo, magnam unde ducimus id. Ipsa, odio
aspernatur? Vel nisi, fugiat alias qui architecto repudiandae porro
voluptatibus optio dolores nemo suscipit aliquam reiciendis tenetur, nulla
rerum corporis atque totam asperiores maiores ipsum voluptates? Error
impedit, deserunt aliquid nulla harum accusamus.
</div>
<div class="pourcent">
<div>Test1</div>
<div>Test2</div>
<div>Test3</div>
</div>
</body>
</html>
<!--
a href
header
main
section
article
aside
footer
strong
ul, ol, li
meta
div
img
nav
table
-->