"Aurea - modelos"
Bootstrap 4.1.1 Snippet by psd06t

Post to Facebook Tweet this

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Agência de Automoveis</title> <meta name="description" content="Source code generated using layoutit.com"> <meta name="author" content="LayoutIt!"> <link href="css/bootstrap.min.css" rel="stylesheet"> <link href="css/style.css" rel="stylesheet"> </head> <body> <div class="container-fluid"> <div class="row"> <div class="col-md-12"> <ul class="nav"> <li class="nav-item"> <a class="nav-link active" href="https://bootsnipp.com/user/snippets/xbdbQ">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="https://bootsnipp.com/user/snippets/4dP9m">Modelos</a> <li class="nav-item"> <a class="nav-link" href="https://bootsnipp.com/user/snippets/eKZ7y">Cadastro</a> </li> </ul> </div> </div> <div class="row"> <div class="col-md-12"> <div class="carousel slide" id="carousel-620049"> <ol class="carousel-indicators"> <li data-slide-to="0" data-target="#carousel-620049" class="active"> </li> <li data-slide-to="1" data-target="#carousel-620049"> </li> <li data-slide-to="2" data-target="#carousel-620049"> </li> </ol> <div class="carousel-inner"> <div class="carousel-item active"> <img class="d-block w-100" alt="Carousel Bootstrap First" src="https://img.r7.com/images/fiat-argo-s-design-02122019123518432?dimensions=660x360"> <div class="carousel-caption"> <h4> Fiat Argo </h4> <p> Eleito o melhor carro da categoria - Prêmio 2019 </p> </div> </div> <div class="carousel-item"> <img class="d-block w-100" alt="Carousel Bootstrap Second" src="https://1.bp.blogspot.com/-Ux5i-d7TbDI/XXxV1Ej24eI/AAAAAAAAW8k/0nwB6sUkDIsfCtJ8RtA6cUduYYH_R6YXgCLcBGAsYHQ/s1600/Novo%2BOnix%2BPremier%2B%25281%2529.jpg"> <div class="carousel-caption"> <h4> Chevrolet Onix </h4> <p> Carro mais vendido da marca Chevrolet. Melhor Design e economia. </p> </div> </div> <div class="carousel-item"> <img class="d-block w-100" alt="Carousel Bootstrap Third" src="https://statig3.akamaized.net/bancodeimagens/59/u0/zg/59u0zgm0cephojlha272w4jfy.jpg"> <div class="carousel-caption"> <h4> Ford Fusion </h4> <p> Toda linha Ford , e também a categoria econômica </p> </div> </div> </div> <a class="carousel-control-prev" href="#carousel-620049" data-slide="prev"><span class="carousel-control-prev-icon"></span> <span class="sr-only">Previous</span></a> <a class="carousel-control-next" href="#carousel-620049" data-slide="next"><span class="carousel-control-next-icon"></span> <span class="sr-only">Next</span></a> </div> </div> </div> <div class="section"> <div class="container"> <div class="row"> <div class="col-lg-4 col-md-6 mb-4"> <div class="item-1"> <a href="#"><img src="https://img.olx.com.br/thumbs256x256/47/477026025757046.jpg" alt="Fiat" class="img-fluid"></a> <div class="item-1-contents"> <div class="text-center"> <h2>Fiat</h2> <div class="rent-price"><span>R$ 25.000</span></div> </div> <ul class="specs"> <li> <span>Portas</span> <span class="spec">4</span> </li> <li> <span>Modelo</span> <span class="spec">Argo</span> </li> <li> <span>Cor</span> <span class="spec">Branca</span> </li> <li> <span>Transmissão</span> <span class="spec">Automatica</span> </li> <li> <span>Ano</span> <span class="spec">2019</span> </li> </ul> <div class="d-flex action"> <a href="https://bootsnipp.com/user/snippets/eKZ7y" class="btn btn-primary">Compre agora</a> </div> </div> </div> </div> <div class="col-lg-4 col-md-6 mb-4"> <div class="item-1"> <a href="#"><img src="https://img.olx.com.br/thumbs256x256/57/570927116253017.jpg" alt="Chevrolet" class="img-fluid"></a> <div class="item-1-contents"> <div class="text-center"> <h2>Chevrolet Onix</h2> <div class="rent-price"><span>R$ 23.000</span></div> </div> <ul class="specs"> <li> <span>Portas</span> <span class="spec">4</span> </li> <li> <span>Modelo</span> <span class="spec">Onix</span> </li> <li> <span>cor</span> <span class="spec">Branca</span> </li> <li> <span>Transmissão</span> <span class="spec">Automatica</span> </li> <li> <span>Ano</span> <span class="spec">2019</span> </li> </ul> <div class="d-flex action"> <a href="https://bootsnipp.com/user/snippets/eKZ7y" class="btn btn-primary">Compre Agora</a> </div> </div> </div> </div> <div class="col-lg-4 col-md-6 mb-4"> <div class="item-1"> <a href="#"><img src="https://img.olx.com.br/thumbs256x256/57/570927116253017.jpg" alt="Ford" class="img-fluid"></a> <div class="item-1-contents"> <div class="text-center"> <h2>Ford Fusion</h2> <div class="rent-price"><span>R$ 31.000</span></div> </div> <ul class="specs"> <li> <span>Portas</span> <span class="spec">4</span> </li> <li> <span>Modelo</span> <span class="spec">Fusion</span> </li> <li> <span>cor</span> <span class="spec">Branca</span> </li> <li> <span>Transmissão</span> <span class="spec">Automatica</span> </li> <li> <span>Ano</span> <span class="spec">2020</span> </li> </ul> <div class="d-flex action"> <a href="https://bootsnipp.com/user/snippets/eKZ7y" class="btn btn-primary">Compre Agora</a> </div> </div> </div> </div> </div> </div> </div> <footer class="rodape"> <div class="container"> <div class="row"> <div class="col-md-4"> <h3>Agência Automotiva Áurea </h3> <p>Rua das Flores, 234 - Centro - Belo Horizonte</p> </div> <div class="col-md-4"> <h3>Acompanhe Nossa Rede Social</h3> </div> <div class="col-md-4"> <img alt="Bootstrap Image Preview" src="https://img.olx.com.br/thumbs256x256/57/570927116253017.jpg"> </div> </div> </div> <div class="row text-center"> <div class="col-md-12"> <p> Copyright ©<script>document.write(new Date().getFullYear());</script> - Áurea Mariza Todos os direitos reservados </p> </div> </div> </footer> </div> <script src="js/jquery.min.js"></script> <script src="js/bootstrap.min.js"></script> <script src="js/scripts.js"></script> </body> </html>
body{ padding:50px; margin: auto; } .nav{ background-color: #101112; } a.nav-item{ color:#d0e9c6; } .rodape { background: #000000; color: #000; text-align: center; } h3{ color:#ffffff; text-align: center; font-size: medium; } p{ color:#d0e9c6; text-align: center; } .container{ margin: auto; padding: 50px; } .card-text{ color: #464a4c; }
var carros = { marca:"Fiat", modelo:"Argo", portas:"4", ano:"2019", fabricante:"Fiat", cor: "Branca", } document.getElementById("carro").innerHTML = carros["marca"] + " " + carros["modelo"]+ " "+ carros["portas"]+" "+carros["ano"]+ " "+carros["fabricante"]+" "+carros["cor"]; function cadastrar(){ var nome = document.getElementById("nome-cliente") var nasc = document.getElementById("nascimento") var tel = document.getElementById("telefone") var endereco = document.getElementById("endereco-cliente") var numero = document.getElementById("numero-residencia") var bairro = document.getElementById("bairro-cliente") var cid = document.getElementById("cidade") var cpf = document.getElementById("cpf-cliente") var ident = document.getElementById("identidade") window.print() }

Related: See More

Material Kit PRO BS3

Questions / Comments: