Design-Pag-Web/Index.html at main · Masterivan503/Design-Pag-Web · GitHub

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
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="css/stile.css">
  <title>Mi pagina web Incrieble</title>
</head>

<body>
  <header class="container section-1">
    <section class="header">
      <div class="logo-img">

        <img
          src="https://static.vecteezy.com/system/resources/previews/035/726/212/original/product-logo-design-vector.jpg"
          alt="logo-img">
      </div>

      <nav class="menu">
        <ul>
          <li><a href="#">Inicio</a></li>
          <li><a href="#">Servicios</a></li>
          <li><a href="#">Galeria</a></li>
          <li><a href="#">Precios</a></li>
          <li><a href="#">Contacto</a></li>
        </ul>
      </nav>
    </section>
  </header>

  <main>
    <section class="container section-2">
      <article class="S2-textos">
        <h1 class="titulo">Bienvenidos 😊😊</h1>
        <hr>
        <p>
          Ofrecemos moda actual y envío rápido para que estrenes hoy mismo.
        </p>
      </article>

      <article class="S2-img">
        <aside class="card">
          <div class="card-imagen">
            <img src="https://tse1.mm.bing.net/th/id/OIP.5xmBns2ABO21QVxlHxlZSgHaK3?cb=12&rs=1&pid=ImgDetMain&o=7&rm=3"
              alt="">
          </div>
          <div class="card-content">
            <h2>Coleccion destacada</h2>
            <p>
              La primavera está a la vuelta de la esquina y como todas mujeres amantes de la moda, debemos actualizarnos
              y estar
              preparadas para tener el mejor look en la primavera
            </p>
            <a href="#">Ver mas</a>
          </div>
        </aside>

        <aside class="card">
          <div class="card-image">
            <img src="https://magozstore.com/cdn/shop/collections/PORTADA-JACKET-PAGINA.jpg?v=1697055352&width=2048"
              alt="">
          </div>
          <div class="card-content">
            <h2>Oferta: 20% en chaquetas</h2>
            <p>
              Duración de la oferta o condiciones.
            </p>
            <a href="#">Ver mas</a>
          </div>
        </aside>

        <aside class="card">
          <div class="card-image">
            <img src="https://cdn-icons-png.freepik.com/512/12638/12638715.png" alt="">
          </div>
          <div class="card-content">
            <h2>Cambio gratuito y asesoría de tallas</h2>
            <p>
              Reducir la fricción por tallas y aumentar confianza.
            </p>
            <a href="#">Contactar</a>
          </div>
        </aside>

      </article>
    </section>
  </main>
  <footer class="footer">
    &copy; 2025 mastercod todos los derechos reservados
  </footer>
</body>

</html>