-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
45 lines (42 loc) · 2.7 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
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="./css/style.css">
</head>
<body>
<main>
<div class="rectangle third">
<div class="bookmark blue"></div>
</div>
<div class="rectangle second">
<div class="bookmark green"></div>
</div>
<div class="rectangle first">
<div class="bookmark orange"></div>
<article>
<span>Lorem ipsum dolor sit amet</span>
<img class="img1" src="./images/css-is-awesome.png" alt="CSS is awesome">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vel velit in nisl accumsan blandit. Mauris sed consequat tortor. Etiam enim odio, elementum sed risus id, faucibus lobortis felis. Donec maximus dolor in egestas fringilla. Pellentesque a neque quis eros lobortis mollis sit amet ut dolor. Aenean nec quam dictum, pharetra nulla et, ornare eros. Quisque accumsan felis vel dolor placerat, sed imperdiet dolor tempor. Morbi et molestie dolor, ac consectetur ipsum. Nullam varius risus in purus bibendum, in auctor odio eleifend. Proin cursus leo quis ex commodo, non placerat diam finibus.</p>
<p class="clear"></p>
<img class="float-right" src="./images/css-for-my-html.png" alt="You are the CSS for my HTML">
<p>Aliquam tempus gravida fermentum. Quisque vel sodales risus. Sed ultricies justo sem, in rutrum neque interdum eget. Donec nec metus nunc. Nullam tempus convallis porttitor. Aliquam tempus gravida fermentum. Quisque vel sodales risus. Sed ultricies justo sem, in rutrum neque interdum eget. Donec nec metus nunc. Nullam tempus convallis porttitor. Sed ultricies justo sem, in rutrum neque interdum eget. Donec nec metus nunc. Nullam tempus convallis porttitor.</p>
<p class="clear"></p>
<p class="big-text">Nulla viverra tortor efficitur vestibulum tristique.</p>
<p class="figure">
<img class="left" src="./images/joke4.png" width="194" height="88" alt="Joke 1">
<img class="right" src="./images/joke1.png" width="194" height="89" alt="Joke 2">
<img class="left" src="./images/joke2.png" width="194" height="89" alt="Joke 3">
<img class="right" src="./images/joke3.png" width="195" height="89" alt="Joke 4">
</p>
<p class="bottom-text">Suspendisse bibendum porttitor purus quis vestibulum. Etiam pellentesque justo ac dui cursus tincidunt. Etiam iaculis semper metus vel facilisis. Etiam ut mi nec libero ullamcorper feugiat a eu augue.</p>
</article>
</div>
<aside>
<p class="share">Share this</p>
<img class="background" src="./images/background-of-social-links.png" alt="Social">
<img class="links" src="./images/social-media-icons.png" alt="Social">
</aside>
</main>
</body>
</html>