-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
106 lines (102 loc) · 3.83 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
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="./css/style.css" />
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.15.3/css/solid.css"
integrity="sha384-LA8Ug4T/nhVkyhrSmSirsoAo9iDrBk8E7U80aSPeD+w3vO8PzOJIS6agGcbIwwX0"
crossorigin="anonymous"
/>
<link
rel="stylesheet"
href="https://use.fontawesome.com/releases/v5.15.3/css/fontawesome.css"
integrity="sha384-wESLQ85D6gbsF459vf1CiZ2+rr+CsxRY0RpiF1tLlQpDnAgg6rwdsUF1+Ics2bni"
crossorigin="anonymous"
/>
<title>Maquetacion cards</title>
</head>
<body>
<div class="title-descuento">
<p>Descuentos 20%</p>
</div>
<header>
<div class="title">
<h1>Card Super Heroes</h1>
</div>
</header>
<main>
<section>
<article class="article-customer">
<div class="background-batman background-customer">
<i class="fas fa-heart icon-heart-customer"></i>
</div>
<div class="image-batman photo-customer"></div>
<div class="description-article">
<h1>Batman</h1>
<p>
Lorem Ipsum is simply dummy text of the printing and typesetting
industry. Lorem Ipsum has been the industry's standard dummy text
ever since the 1500s, when an unknown printer took a galley of
type and scrambled it to make a type specimen book. It has
survived not only five centuries, but also the leap into
electronic typesetting
</p>
</div>
<div class="button-customer">
<button>Ver mas</button>
</div>
</article>
<article class="article-customer">
<div>
<div class="background-mmaravilla background-customer"></div>
<i class="fas fa-heart icon-heart-customer"></i>
<div class="image-mmaravilla photo-customer"></div>
</div>
<div class="description-article">
<h1>Mujer Maravilla</h1>
<p>
Es una superheroína creada por William Moulton Marston para la
editorial DC Comics. Es una princesa guerrera de las Amazonas,
pueblo ficticio basado en el de las amazonas de la mitología
griega. En su tierra natal es conocida como la princesa Diana de
Temiscira pero fuera de esta utiliza la identidad secreta de Diana
Prince.
</p>
</div>
<div class="button-customer">
<button>Ver mas</button>
</div>
</article>
<article class="article-customer">
<div class="background-superman background-customer"></div>
<i class="fas fa-heart icon-heart-customer"></i>
<div class="image-superman photo-customer"></div>
<div class="description-article">
<h1>Superman</h1>
<p>
Es un superhéroe que apareció por primera vez en los cómics
estadounidenses publicados por DC Comics. El personaje fue
creado por el escritor estadounidense Jerry Siegel y el artista
canadiense Joe Shuster en 1933 cuando ambos se encontraban
viviendo en Cleveland, Ohio.
</p>
</div>
<div class="button-customer">
<button>Ver mas</button>
</div>
</article>
</section>
<button class="plus-customer">
<i class="fas fa-plus icon-plus-customer"></i>
</button>
</main>
<footer>
<h3>Todos los derechos reservados a FRONT END 1</h3>
<img src="./img/github.png" alt="" />
</footer>
</body>
</html>