JavaScript_DOM_Eventos_inicio/cursos.html at main · ncc001/JavaScript_DOM_Eventos_inicio · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>BlogDeCafé</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans&family=PT+Sans:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>

    <header class="header">

        <div class="contenedor">
            <div class="barra">
                <a class="logo" href="index.html">
                    <h1 class="logo__nombre no-margin centrar-texto">Blog<span class="logo__bold">DeCafé</span></h1>
                </a>

                <nav class="navegacion">
                    <a href="nosotros.html" class="navegacion__enlace">Nosotros</a>
                    <a href="cursos.html" class="navegacion__enlace">Cursos</a>
                    <a href="contacto.html" class="navegacion__enlace">Contacto</a>
                </nav>
            </div>
        </div>

        <div class="header__texto">
            <h2 class="no-margin">Blog de café con consejos y cursos</h2>
            <p class="no-margin">Aprende de los expertos con las mejores recetas y consejos</p>
        </div>
    </header>

    <main class="contenedor">
        <h3 class="centrar-texto">Nuestros Próximos Cursos y Talleres</h3>

        <div class="curso">
            <div class="curso__imagen">
                <img src="img/curso1.jpg" alt="Imagen del curso">
            </div>
            <div class="curso__informacion">
                <h4 class="no-margin">Técnicas de extracción de café</h4>
                <p class="curso__label">Precio:
                    <span class="curso__info">Gratis</span>
                </p>
                <p class="curso__label">Cupo:
                    <span class="curso__info">20</span>
                </p>
                <p class="curso__descripcion">
                    Donec tempor, nisl et rhoncus viverra, turpis enim convallis ligula, non hendrerit nulla tortor nec odio. Morbi non mattis nunc, elementum auctor arcu. Aliquam vestibulum arcu non sem porta auctor. Nam vel congue ligula, eu condimentum felis. Nunc aliquam hendrerit odio sit amet venenatis. Nunc varius, libero a tempor rutrum, nulla risus congue velit, nec suscipit nibh lectus ac dolor. Nulla facilisi.
                </p>
            </div> <!--.curso-informacion-->
        </div> <!--.curso -->

        <div class="curso">
            <div class="curso__imagen">
                <img src="img/curso2.jpg" alt="Imagen del curso">
            </div>
            <div class="curso__informacion">
                <h4 class="no-margin">Taller para Tostar y Moler Granos</h4>
                <p class="curso__label">Precio:
                    <span class="curso__info">Gratis</span>
                </p>
                <p class="curso__label">Cupo:
                    <span class="curso__info">20</span>
                </p>
                <p class="curso__descripcion">
                    Donec tempor, nisl et rhoncus viverra, turpis enim convallis ligula, non hendrerit nulla tortor nec odio. Morbi non mattis nunc, elementum auctor arcu. Aliquam vestibulum arcu non sem porta auctor. Nam vel congue ligula, eu condimentum felis. Nunc aliquam hendrerit odio sit amet venenatis. Nunc varius, libero a tempor rutrum, nulla risus congue velit, nec suscipit nibh lectus ac dolor. Nulla facilisi.
                </p>
            </div> <!--.curso-informacion-->
        </div> <!--.curso -->

        <div class="curso">
            <div class="curso__imagen">
                <img src="img/curso3.jpg" alt="Imagen del curso">
            </div>
            <div class="curso__informacion">
                <h4 class="no-margin">4 Recetas de Café para Principiantes</h4>
                <p class="curso__label">Precio:
                    <span class="curso__info">Gratis</span>
                </p>
                <p class="curso__label">Cupo:
                    <span class="curso__info">20</span>
                </p>
                <p class="curso__descripcion">
                    Donec tempor, nisl et rhoncus viverra, turpis enim convallis ligula, non hendrerit nulla tortor nec odio. Morbi non mattis nunc, elementum auctor arcu. Aliquam vestibulum arcu non sem porta auctor. Nam vel congue ligula, eu condimentum felis. Nunc aliquam hendrerit odio sit amet venenatis. Nunc varius, libero a tempor rutrum, nulla risus congue velit, nec suscipit nibh lectus ac dolor. Nulla facilisi.
                </p>
            </div> <!--.curso-informacion-->
        </div> <!--.curso -->


    </main>

    <footer class="footer">
        <div class="contenedor">
            <div class="barra">
                <a class="logo" href="index.html">
                    <h1 class="logo__nombre no-margin centrar-texto">Blog<span class="logo__bold">DeCafé</span></h1>
                </a>

                <nav class="navegacion">
                    <a href="nosotros.html" class="navegacion__enlace">Nosotros</a>
                    <a href="cursos.html" class="navegacion__enlace">Cursos</a>
                    <a href="contacto.html" class="navegacion__enlace">Contacto</a>
                </nav>
            </div>
        </div>
    </footer>
    <script src="js/modernizr.js"></script>
</body>
</html>