SuaDev09.github.io/gorillaz.html at main · SuaDev09/SuaDev09.github.io · 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
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
<!DOCTYPE html>
<html lang="en">
<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">
    <title>Gorillaz</title>
    <link rel="stylesheet" href="./css/gorillaz.css">
    <link rel="stylesheet" href="https://unpkg.com/flowbite@1.5.3/dist/flowbite.min.css" />
    <link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet">
</head>
<body>
    <header>
        <nav class="p-4 bg-gray-50 rounded border-gray-200 fixed w-full z-20 top-0 left-0 dark:bg-gray-800 dark:border-gray-700">
            <div class="container flex flex-wrap justify-between items-center mx-auto">
              <a href="#" class="flex items-center">
                  <img src="https://flowbite.com/docs/images/logo.svg" class="mr-3 h-6 sm:h-10" alt="Flowbite Logo" />
                  <span class="self-center text-xl font-semibold whitespace-nowrap dark:text-white">SuaDev09</span>
              </a>
              <button data-collapse-toggle="navbar-solid-bg" type="button" class="inline-flex justify-center items-center ml-3 text-gray-400 rounded-lg md:hidden hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-300 dark:text-gray-400 dark:hover:text-white dark:focus:ring-gray-500" aria-controls="navbar-solid-bg" aria-expanded="false">
                <span class="sr-only">Open main menu</span>
                <svg class="w-6 h-6" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path></svg>
              </button>
              <div class="hidden w-full md:block md:w-auto" id="navbar-solid-bg">
                <ul class="flex flex-col mt-4 bg-gray-50 rounded-lg md:flex-row md:space-x-8 md:mt-0 md:text-sm md:font-medium md:border-0 md:bg-transparent dark:bg-gray-800 md:dark:bg-transparent dark:border-gray-700">
                  <li>
                    <a href="#" target="_blank"class="block py-2 pr-4 pl-3 text-gray-700 rounded hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-blue-700 md:p-0 dark:text-gray-400 md:dark:hover:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent" aria-current="page">Inicio</a>
                  </li>
                  <li>
                    <button id="dropdownNavbarLink" data-dropdown-toggle="dropdownNavbar" class="flex justify-between items-center py-2 pr-4 pl-3 w-full font-medium text-white bg-blue-700 rounded hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-blue-700 md:p-0 md:w-auto dark:text-white dark:hover:text-white dark:focus:text-white dark:border-gray-700 dark:hover:bg-gray-700 md:dark:hover:bg-transparent md:dark:bg-transparent"> Practicas <svg class="ml-1 w-5 h-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg></button>
                    <!-- Dropdown menu -->
                    <div id="dropdownNavbar" class="hidden z-10 w-44 font-normal bg-white rounded divide-y divide-gray-100 shadow dark:bg-gray-700 dark:divide-gray-600">
                        <ul class="py-1 text-sm text-gray-700 dark:text-gray-400" aria-labelledby="dropdownLargeButton">
                          <li>
                            <a href="./index.html" target="_blank" class="block py-2 px-4 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Practica 1</a>
                          </li>
                          <li>
                            <a href="./gorillaz.html" target="_blank" class="block py-2 px-4 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Practica 2</a>
                          </li>
                          <li>
                            <a href="./practica3.html" target="_blank" class="block py-2 px-4 hover:bg-gray-100 dark:hover:bg-gray-600 dark:hover:text-white">Practica 3</a>
                          </li>
                        </ul>
                    </div>
                </li>
                  <li>
                    <a href="https://github.com/SuaDev09" target="_blank" class="block py-2 pr-4 pl-3 text-gray-700 rounded hover:bg-gray-100 md:hover:bg-transparent md:border-0 md:hover:text-blue-700 md:p-0 dark:text-gray-400 md:dark:hover:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent">Github</a>
                  </li>
                </ul>
              </div>
            </div>
          </nav>
    </header>

    <section class="content-gorillaz">
        <div class="info-gorillaz">
            <h1>Gorillaz</h1>
            <p>Gorillaz es una banda virtual inglesa creada en 1998 por Damon Albarn y Jamie Hewlett.</p>
            <img src="./img/gorillaz/gorillaz.jpg" class="img"></img>
        </div>

        <div class="integrantes-gorillaz">
            <h2>Integrantes del grupo</h2>
            <ul class="integrantes-lista">
                <li>2-D</li>
                <li>Murdoc Niccals</li>
                <li>Russel Hobbs</li>
                <li>Noodle</li>
            </ul>
        </div>
        <div class="discografia-gorillaz">
            <h2>Discografia</h2>
            <p>Grandes exitos de Gorillaz</p>
            <table>
                <thead>
                    <th>Año</th>
                    <th>Disco</th>
                </thead>
                <tbody>
                    <tr>
                        <td class="anio">2005</td>
                        <td>Demon Days</td>
                    </tr>
                    <tr>
                        <td class="anio">2010</td>
                        <td>Plastic Beach</td>
                    </tr>
                    <tr>
                        <td class="anio">2001</td>
                        <td>Gorillaz</td>
                    </tr>
                    <tr>
                        <td class="anio">2017</td>
                        <td>Humanz</td>
                    </tr>
                </tbody>
                <tfoot>
                    <td colspan="2">“Demon Days” debutó en el primer lugar de las listas de popularidad y logró vender más de 8 millones de copias a nivel mundial.</td>
                </tfoot>
            </table>
        </div>

        <a href="https://www.gorillaz.com/" class="link-gorillaz" target="_blank">
            <h2>Sitio Web Oficial</h2>
        </a>
    </section>

    <footer id="seccion-contact">
        <div class="seccion-contact-text">
            <p>
                <b>SuaDev09.</b> Todos Los Derechos Reservados 2021 ©
            </p>
        </div>

        <div class="seccion-contact-imgs">
            <a href="">
                <img src="img/facebook.png" class="logo" alt="Facebook">
            </a>
            <a href="">
                <img src="img/twitter.png" class="logo" alt="Twitter">
            </a>
            <a href="">
                <img src="img/instagram.png" class="logo" alt="Instagram">
            </a>
        </div>
    </footer>

    <script src="https://unpkg.com/flowbite@1.5.3/dist/flowbite.js"></script>
    <script src="https://cdn.tailwindcss.com"></script>

</body>
</html>