Untitled

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>News</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" integrity="sha384-AysaV+vQoT3kOAXZkl02PThvDr8HYKPZhNT5h/CXfBThSRXQ6jW5DO2ekP5ViFdi" crossorigin="anonymous">
    </head>
    <body>
        <div class="container">
            <header>
                <h1>News</h1>
                <nav class="navbar navbar-light bg-faded">
                    <ul class="nav navbar-nav">
                        <li class="nav-item active">
                            <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Tecnologia</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Economia</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="#">Esportes</a>
                        </li>
                    </ul>
                    <form class="form-inline float-xs-right">
                        <input class="form-control" type="text" placeholder="Pesquise uma notícia" size="30">
                        <button class="btn" type="submit">Buscar</button>
                    </form>
                </nav>
            </header>
            <br>
            <div class="row">
                <div class="col-md-4">
                    <div class="card">
                        <img class="card-img-top img-fluid" src="http://s2.glbimg.com/sZZV3m_9hYuI5JQqKHwpS03G-X8=/0x168:2400x1520/540x304/smart/http://s.glbimg.com/jo/g1/f/original/2016/12/05/neuv.jpg" alt="Card image cap">
                        <div class="card-block">
                            <h4 class="card-title">Honda revela conceito de carro com 'emoções' e que conversa</h4>
                            <p class="card-text">Tecnologia permite ao carro gerar artificialmente suas próprias emoções.</p>
                            <a href="#" class="btn btn-primary">Leia mais</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card">
                        <img class="card-img-top img-fluid" src="http://s2.glbimg.com/lLIl-hSFxBcUfZmCc8uKevkaQzI=/0x200:2000x1327/540x304/smart/http://s2.glbimg.com/v4b7IUmjslzIJl8OCYHuTRID7Kg=/0x0:2000x1331/2000x1331/s.glbimg.com/jo/g1/f/original/2016/11/11/pimentel_C8zrp4D.jpg" alt="Card image cap">
                        <div class="card-block">
                            <h4 class="card-title">Pimentel pede reconhecimento de calamidade em MG</h4>
                            <p class="card-text">Estado enfrenta uma das piores crises financeiras da história.</p>
                            <a href="#" class="btn btn-primary">Leia mais</a>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="card">
                        <img class="card-img-top img-fluid" src="http://s2.glbimg.com/f-ZQPgia2D_2u0Itcu84C4GVOLM=/0x100:1700x1058/540x304/smart/http://s2.glbimg.com/yeQiNKFaZHel0n05pLc9qhaX1Z4=/0x0:1700x1065/1700x1065/s.glbimg.com/jo/g1/f/original/2016/09/02/bgs_img_0695_marcelo_brandt_g1.jpg" alt="Card image cap">
                        <div class="card-block">
                            <h4 class="card-title">Ancine anuncia R$ 10 milhões para produção de games</h4>
                            <p class="card-text">Edital será aberto nesta terça e será dividido entre até 24 projetos.</p>
                            <a href="#" class="btn btn-primary">Leia mais</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/js/bootstrap.min.js" integrity="sha384-BLiI7JTZm+JWlgKa0M0kGRpJbF2J8q+qreVrKBC47e3K6BW78kGLrCkeRX6I9RoK" crossorigin="anonymous"></script>
    </body>
</html>