-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
109 lines (96 loc) · 5.85 KB
/
Copy pathindex.html
File metadata and controls
109 lines (96 loc) · 5.85 KB
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
<!--Proyecto de CSS: David Avalos y Alfredo Puentes-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OSWI - Inicio</title>
<link rel="preload" href="CSS/normalize.css" as="style">
<link rel="stylesheet" href="CSS/normalize.css">
<link rel="preload" href="CSS/style.css" as="style">
<link href="CSS/style.css" rel="stylesheet">
</head>
<body class="fondo">
<div class="nav-bar"> <!--Boton para redirigir a otras paginas-->
<nav class="nav-principal">
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" class="icono" width="25" height="25" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffde59" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<path d="M4 6l16 0" />
<path d="M4 12l16 0" />
<path d="M4 18l16 0" />
</svg>
</a>
<img src="img/OSWI-logo-negro.png" height="100rem">
<a class="boton" href="#marcas">Marcas</a>
<a class="boton" href="#ofertas">Ofertas</a>
<a class="boton" href="#tendencias">Tendencias</a>
<a class="boton" href="indices/contacto.html">Contacto</a>
<a href="indices/login.html"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" class="icono" width="25" height="25">
<path fill-rule="evenodd" d="M18.685 19.097A9.723 9.723 0 0 0 21.75 12c0-5.385-4.365-9.75-9.75-9.75S2.25 6.615 2.25 12a9.723 9.723 0 0 0 3.065 7.097A9.716 9.716 0 0 0 12 21.75a9.716 9.716 0 0 0 6.685-2.653Zm-12.54-1.285A7.486 7.486 0 0 1 12 15a7.486 7.486 0 0 1 5.855 2.812A8.224 8.224 0 0 1 12 20.25a8.224 8.224 0 0 1-5.855-2.438ZM15.75 9a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0Z" clip-rule="evenodd" />
</svg>
</a>
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" class="icono" width="25" height="25" viewBox="0 0 24 24" stroke-width="1.5" stroke="#ffde59" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none"/>
<path d="M6 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
<path d="M17 19m-2 0a2 2 0 1 0 4 0a2 2 0 1 0 -4 0" />
<path d="M17 17h-11v-14h-2" />
<path d="M6 5l14 1l-1 7h-13" />
</svg>
</a>
</nav>
</div>
<section class="banner"> <!--Sección para el banner-->
<img src="img/BannerTenis.png" width="80%">
</section>
<a class="subtitulo">Destacado</a>
<main class="contenedor sombra"> <!--Sección para destacados-->
<div class="contenedor-diseños">
<div class="aux"><img src="img/Colab.png.png" height="50%"></div>
<div class="aux"><img class="colabs" src="img/AirForce-GatosNegros.png"></div> <!--Destacado1-->
<div class="aux"><img class="colabs" src="img/AirForce-GatosNegros2.png"></div> <!--Destacado2-->
<div class="aux"><img class="colabs" src="img/AirForce-GatosNegros3.png"></div> <!--Destacado3-->
<div class="aux"><img class="colabs" src="img/Adidas-GatosNegros.png"></div> <!--Destacado4-->
<div class="aux"><img class="colabs" src="img/Adidas-GatosNegros2.png"></div> <!--Destacado5-->
<div class="aux"><img class="colabs" src="img/Vans-GatosNegros.png"></div> <!--Destacado6-->
</div>
</main>
<a name="marcas" class="subtitulo">Nuestras marcas</a>
<main class="contenedor sombra"> <!--Sección para exponer marcas-->
<br><br>
<div class="marcas">
<div class="iconos"><img src="img/vans.png" height="50rem" width="70rem"></div> <!--Marca1-->
<div class="iconos"><img src="img/nike.png" height="50rem" width="80rem"></div> <!--Marca2-->
<div class="iconos"><img src="img/adidas.svg" height="50rem" width="70rem"></div> <!--Marca3-->
<div class="iconos"><img src="img/converse.png" height="50rem" width="70rem"></div> <!--Marca5-->
<div class="iconos"><img src="img/puma.svg" height="50rem" width="70rem"></div> <!--Marca6-->
</div>
<br><br>
</main>
<a name="ofertas" class="subtitulo">Ofertas</a>
<main class="contenedor sombra"> <!--Sección para mostar ofertas-->
<div class="marcas">
<!--<section class="oferta">-->
<div class="mostrar"><h3>¡¡OFERTA 1!!</h3><img src="img/af1.jpg"><p>$5700 | AirForce1</p></div> <!--Oferta1-->
<!--</section>-->
<!--<section class="oferta">-->
<div class="mostrar"><h3>¡¡OFERTA 2!!</h3><img src="img/j1.jpg"><p>$3200 | Jordan1</p></div> <!--Oferta2-->
<!--</section>-->
<!--<section class="oferta">-->
<div class="mostrar"><h3>¡¡OFERTA 3!!</h3><img src="img/j4.jpg"><p>$2500 | Jordan4</p></div> <!--Oferta3-->
<!--</section>-->
</div>
</main>
<a name="tendencias" class="subtitulo">Lo ultimo</a>
<main class="contenedor sombra"> <!--Sección para mostrar lo ultimo relevante-->
<div class="marcas">
<div class="mostrar"><h3>¡¡TENDENCIA!!</h3><img src="img/adidas1.jpg"><p>ADIDAS HIGH</p></div> <!--Relevante1-->
<div class="mostrar"><h3>¡¡TENDENCIA!!</h3><img src="img/adidas2.png"><p>ADIDAS LOW</p></div> <!--Relevante2-->
<div class="mostrar"><h3>¡¡TENDENCIA!!</h3><img src="img/vansYB.jpg"><p>VANS</p></div> <!--Relevante3-->
</div>
</main>
<footer>
<p>David Avalos | Alfredo Puentes <br> Todos los derechos reservados</p>
</footer>
<!--Hacer un formulario para log in-->
</body>
</html>