-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathproductos.html
174 lines (171 loc) · 9.02 KB
/
productos.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
173
174
<!DOCTYPE html>
<html lang="es">
<head>
<!--Required meta tags-->
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>Nuestros productos</title>
<!--Seo-->
<meta name="description" content="Super ofertas con una gran variedad de productos a los mejores precios en la ciudad de Huancayo">
<meta name="keywords" content="Productos, abarrotes, bebidas, golosinas, limpieza, Huancayo">
<meta name="author" content="Jason Alanya">
<!--Open graph-->
<meta property="og:locale" content="es_ES">
<meta property="og:type" content="website">
<meta property="og:title" content="La mejor tienda virtual de Huancayo">
<meta property="og:description" content="Consigue la mayor variedad de productos al mejor precio de Huancayo">
<meta property="og:image" content="imagenes/imagen-social.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="600">
<!--Estilos para la página-->
<link rel="icon" type="image/png" href="imagenes/logotipo.png"/>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@500&family=Russo+One&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
<link rel="stylesheet" href="CSS/styles.css">
</head>
<body>
<!--Imagen principal-->
<Figure class="imagenprincipal portada_productos">
<img src="imagenes/portada_productos.jpg" alt="Foto de portada inicio">
</Figure>
<!--La sección header tendrá el logo y las diferentes secciones de la página-->
<header class="header">
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="index.html">
<img src="imagenes/logotipo.png" height="50px" alt="Logotipo principal de la empresa">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-item nav-link" href="index.html">Inicio</a>
<a class="nav-item nav-link" href="nosotros.html">Nosotros</a>
<a class="nav-item nav-link active" href="productos.html">Productos<span class="sr-only">(current)</span></a>
<a class="nav-item nav-link" href="contactanos.html">Ubicanos</a>
<a class="nav-item nav-link" href="carrito.html">Carrito</a>
</div>
</div>
</nav>
</header>
<!--Sección para la portada-->
<section class="portada texto-productos">
<p>
Nuestros productos
</p>
</section>
<!--Sección para las categorías-->
<section id="bebidas" class="productos_top">
<h1>Bebidas</h1>
<div class="cuadros-producto">
<div class="producto">
<img src="imagenes/productos/yogurt-gloria0.jpg" alt="Imagen de los productos relacionados al Yogurt Gloria">
<h2>Yogurt gloria</h2>
<button><a href="paginas_productos/yogurt_gloria.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/frugos-0.jpg" alt="Imagen de los productos relacionados a los productos de Frugos">
<h2>Frugos</h2>
<button><a href="paginas_productos/frugos.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/coca-cola-0.jpg" alt="Logotipo de la marca Coca cola">
<h2>Coca cola</h2>
<button><a href="paginas_productos/coca-cola.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/inca-kola-0.jpg" alt="Logotipo de la marca Inca kola">
<h2>Inca Kola</h2>
<button><a href="paginas_productos/inca-kola.html">Descripción</a></button>
</div>
</div>
</section>
<section id="limpieza" class="productos_top">
<h1>Limpieza</h1>
<div class="cuadros-producto">
<div class="producto">
<img src="imagenes/productos/suave-0.jpg" alt="Logotipo de los productos suave">
<h2>Papel Suave</h2>
<button><a href="paginas_productos/suave.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/elite-0.jpeg" alt="Logotipo de los productos elite">
<h2>Papel Elite</h2>
<button><a href="paginas_productos/elite.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/noble-0.jpg" alt="Logotipo de los productos noble">
<h2>Papel Noble</h2>
<button><a href="paginas_productos/noble.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/higienol-0.jpg" alt="Logotipo de los productos higienol">
<h2>Papel higienol</h2>
<button><a href="paginas_productos/higienol.html">Descripción</a></button>
</div>
</div>
</section>
<section id="golosinas" class="productos_top">
<h1>Golosinas</h1>
<div class="cuadros-producto">
<div class="producto">
<img src="imagenes/productos/cereal-angel-0.jpg" alt="Logotipo de cereales ángel">
<h2>Cereales Ángel</h2>
<button><a href="paginas_productos/cereal-angel.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/ole-ole-0.jpg" alt="Logotipo de Ole Ole">
<h2>Olé Olé</h2>
<button><a href="paginas_productos/ole-ole.html">Descripción</a></button>
</div>
<!--<div class="producto">
<img src="imagenes/p_tonderito.jpg" alt="">
<button><a href="descrip_producto.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/p_tonderito.jpg" alt="">
<button><a href="descrip_producto.html">Descripción</a></button>
</div>-->
</div>
</section>
<section id="abarrotes" class="productos_top">
<h1>Abarrotes</h1>
<div class="cuadros-producto">
<div class="producto">
<img src="imagenes/productos/tonderito-0.jpg" alt="Logotipo del producto tonderito">
<h2>Arroz tonderito</h2>
<button><a href="paginas_productos/tonderito.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/don-vittorio-0.jpg" alt="Logotipo de fideos Don Vittorio">
<h2>Fideos Don Vittorio</h2>
<button><a href="paginas_productos/don-vittorio.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/3-ositos-0.jpg" alt="Logotipo 3 ositos">
<h2>Avena 3 ositos</h2>
<button><a href="paginas_productos/3-ositos.html">Descripción</a></button>
</div>
<div class="producto">
<img src="imagenes/productos/andahuasi-0.jpeg" alt="Logotipo de azucar Andahuasi">
<h2>Azucar Andahuasi</h2>
<button><a href="paginas_productos/andahuasi.html">Descripción</a></button>
</div>
</div>
</section>
<!--Sección para el pie de página-->
<footer class="footer">
<figure>
<img src="imagenes/peru.png" alt="Logotipo de la marca Perú" width="200px">
</figure>
<div class="derechos">
© 2020<a href="">Jason Alanya</a><a href="">GN MARKT</a>
</div>
</footer>
<!--Scripts para el bootstrap-->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
</body>
</html>