project1-github-repo/index.html at main · aledeleonez/project1-github-repo · 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
<!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="style.css">
    <title>Inicio</title>
</head>
<body>
    <nav>
        <input id="desplegable" type="checkbox">
        <div class="logo"><img src="./img/logoThor.png" alt="logo" href="/index.html"></div>
        <ul class="links">
            <li><a href="https://aledeleonez.github.io/project1-github-repo/index.html">Inicio</a></li>
            <li><a href="https://aledeleonez.github.io/project1-github-repo/personajes.html">Personajes</a></li>
            <li><a href="https://aledeleonez.github.io/project1-github-repo/peliculas.html">Peliculas</a></li>
            <li><a href="https://aledeleonez.github.io/project1-github-repo/contacto.html">Contacto</a></li>
        </ul>
        <label for="desplegable" class="icon-burger">
            <div class="line"></div>
            <div class="line"></div>
            <div class="line"></div>
        </label>
    </nav>
    <div class="imagen-inicio">
        <div class="inicio-text">
            <h1>Bienvenido a la web de Thor</h1>
            <p>En este sitio encontraras todo lo relacionado con el Dios del Trueno, sus peliculas y sus personajes.</p>
            <h2>Escríbenos cualquier duda: </h2>
        </div>
    </div>
    <div class="titulo">
        <h1>Peliculas</h1>
    </div>
    <section class="contenedor">
        <div class="tarjeta">
            <div class="imagen-tarjeta peli1"></div>
            <h1>Thor</h1>
            <p>Thor es un arrogante y codicioso guerrero cuya imprudencia desata una antigua guerra. Por ese motivo, su padre Odín lo castiga desterrándolo a la Tierra para que viva entre los hombres y descubra así el verdadero sentido de la humildad.</p>
            <a href="/#">Saber más</a>
        </div>
        <div class="tarjeta">
            <div class="imagen-tarjeta peli2"></div>
            <h1>Thor: El mundo oscuro</h1>
            <p>Thor lucha por restablecer el orden en el cosmos, pero una antigua raza liderada por el vengativo Malekith regresa con el propósito de volver a sumir el universo en la oscuridad.</p>
            <a href="/#">Saber más</a>
        </div>
        <div class="tarjeta">
            <div class="imagen-tarjeta peli3"></div>
            <h1>Thor: Ragnarok</h1>
            <p>Thor está preso al otro lado del universo sin su poderoso martillo y se enfrenta a una carrera contra el tiempo. Su objetivo es volver a Asgard y parar el Ragnarok porque significaría la destrucción de su planeta natal y el fin de la civilización Asgardiana a manos de una todopoderosa y nueva amenaza, la implacable Hela.</p>
            <a href="/#">Saber más</a>
        </div>
        <div class="tarjeta">
            <div class="imagen-tarjeta peli4"></div>
            <h1>Thor: Love and Thunder</h1>
            <p>El Dios del Trueno (Chris Hemsworth) emprende un viaje que no se parece en nada a lo que se ha enfrentado hasta ahora: una búsqueda de la paz interior. Pero el retiro de Thor se ve interrumpido por un asesino galáctico conocido como Gorr el Carnicero de Dioses (Christian Bale), que busca la extinción de los dioses.</p>
            <a href="/#">Saber más</a>
        </div>
    </section>
    <div class="titulo">
        <h1>Personajes</h1>
    </div>
    <section class="contenedor">
        <div class="tarjeta">
            <div class="imagen-tarjeta personaje1"></div>
            <h1>Thor</h1>
            <h3>Actor: Chris Hemsworth</h3>
            <a href="/#">Saber más</a>
        </div>
        <div class="tarjeta">
            <div class="imagen-tarjeta personaje2"></div>
            <h1>Jane Foster</h1>
            <h3>Actriz: Natalie Portman</h3>
            <a href="/#">Saber más</a>
        </div>
        <div class="tarjeta">
            <div class="imagen-tarjeta personaje3"></div>
            <h1>Loki</h1>
            <h3>Actor: Tom Hiddleston</h3>
            <a href="#">Saber más</a>
        </div>
    </section>
    <footer>
        <h3>Web de información sobre las peliculas de Thor en el UCM</h3>
        <p>Diseño por Alejandro de León Fernández 2023</p>
    </footer>
</body>
</html>