newsBlog/index.html at master · Koolxtreme/newsBlog · 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
<!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">
    <title>Koolnews</title>
    <!-- Font Awesome-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <!-- Normalize-->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <!-- Custom CSS-->
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="container">
        <nav class="menu">
            <img src="./img/logo.jpg" alt="Logo" class="menu__logo">

            <ul class="menu__list" id="menuList">
                <li><a href="#">Inicio</a></li>
                <li><a href="#">Titulares</a></li>
                <li><a href="#">Tecnologia</a></li>
                <li><a href="#">Video Juegos</a></li>
                <li><a href="#">Más noticias</a></li>
            </ul>
            <a href="#" class="menu__btn fas fa-bars" id="menuBtn"></a>
            <ul class="menu__search"><li><a href="#"><i class="fas fa-search"></i></a></li></ul>
        </nav>
        <hr>
        <header class="showcase">
            <h1>Se acercan novedades en lanzamientos Xiaomi</h1>
            <p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Magnam dicta porro, ipsa non ullam dignissimos fugiat unde rem natus alias deserunt ad cumque sit deleniti veniam totam doloribus quasi odio!</p>
            <a href="#" class="btn"> Leer más <i class="fas fa-angle-double-right"></i></a>
        </header>
        <div class="gridNews">
            <div class="gridNews__item">
                <img src="./img/new1.jpg" alt="">
                <h3> Noticias sobre el lanzamiento de Halo Infinity</h3>
                <p> Así es se acerca el lanzamiento de este titulo esperado por todos...</p>
                <a href="#"> Leer más <i class="fas fa-angle-double-right"></i></a>
            </div>
            <div class="gridNews__item">
                <img src="./img/new2.jpg" alt="">
                <h3> Siguen las quejas contra Blizzard</h3>
                <p> Hace varias semanas se vienen dando denuncias en contra de la compañia que ahora se enfreta a denuncias por acoso laboral...</p>
                <a href="#"> Leer más <i class="fas fa-angle-double-right"></i></a>
            </div>
            <div class="gridNews__item">
                <img src="./img/new3.jpg" alt="">
                <h3> Adaptan turbina a un RX-7</h3>
                <p> Un dedicado ingeniero apasionado por los vehiculos gracias a la ayuda de varios turbos crea una turbina adaptable a este sutil vehiculo...</p>
                <a href="#"> Leer más <i class="fas fa-angle-double-right"></i></a>
            </div>
            <div class="gridNews__item">
                <img src="./img/new4.jpg" alt="">
                <h3> Tenemos finalistas para WORLDS 2021 de League of Legends</h3>
                <p> Tras terminar la etapa de semifinales con acalorados encuentros entre T1 con Dawon Kia y ...</p>
                <a href="#"> Leer más <i class="fas fa-angle-double-right"></i></a>
            </div>
        </div>
    </div>
<script src="main.js"></script>
</body>
</html>