generated from 4GeeksAcademy/html-hello
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
67 lines (64 loc) · 2.46 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<script src="https://kit.fontawesome.com/68013aa1e1.js" crossorigin="anonymous"></script>
<title>Post de Isntagram</title>
</head>
<body>
<!-- Post de Instagram -->
<div class="post">
<!-- Header -->
<div class="header">
<div class="orden-logo">
<div class="logo">
<i class="fa-brands fa-html5" class="tamaño"></i>
</div>
<div class="post-header">
<h3>HTML5</h3>
<p1>Rigoberto</p1>
</div>
</div>
<div class="orden-puntos">
<div class="puntos">
<i class="fa-solid fa-ellipsis-vertical"></i>
</div>
</div>
</div>
<!-- Imagen -->
<div class="image">
<img src="https://www.turismoasturias.es/documents/39908/62613/PORTADA-moandi-pilona.jpg/64402123-637b-41d9-16d9-792135fa1567"
alt="" class="img">
</div>
<!-- Iconos -->
<div class="icons">
<div class="icons3">
<i class="fa-regular fa-heart"></i>
<i class="fa-regular fa-comment"></i>
<i class="fa-regular fa-paper-plane"></i>
</div>
<div class="icono-guardar">
<i class="fa-regular fa-bookmark"></i>
</div>
</div>
<!-- Footer -->
<div class="post-footer">
<p2>Liked by<strong>4GeeksAcademy, HTML5, web</strong>and <strong>100,000others</strong></p2>
</div>
<div class="parrafo-footer">
<p3>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam a sem mi. Integer non est id
tellus
accumsan blandit vel convallis nulla. Vivamus nec est lectus. Aliquam at libero ornare sem
blandit
mattis. Aliquam placerat consequat ante, in sodales dui pulvinar vitae. Nulla non pellentesque
risus. Nam bibendum dapibus odio pharetra rhoncus. Donec facilisis purus non purus tristique
malesuada. Pellentesque congue vitae ante et sodales. Cras semper purus erat, id porta nunc
semper
quis.
</p3>
</div>
</div>
</body>
</html>