"Fernanda_Figueiredo-Exercicio 3"
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> <head> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> </head> <body> <div class="container"> <div class="row"> <div class="col-md-12"> <h1> <img style=" width: 300px; padding: 5px;" src="https://www.webmotors.com.br/assets/img/webmotors.svg?t=694images/logo.png" alt="some text" width=300 height=200> </h1> <h4>Figueiredos Particular</h4> <h5>Negocie direto com o proprietário</h5> </div> </div> </div> <div class="container"> <div class="row mb-3"> <div class="col-md-12"> <img src="https://spncr.s3.amazonaws.com/img/VcPQ8Wc7RSmmnMJVqe9OAQ/file.jpg"> </div> </div> </div> <div class="container-fluid"> <div class="row mb-2"> <div class="col-md-12"> <div class="card"> <div class="card-body"> <div class="row"> <div class="col-md-12"> <h4 class="text-danger">Caracteristicas</h4> <hr> </div> </div> <div class="row mb-4"> <div class="col-md-1"> <h5 class="text-secondary">MARCA</h5> <h6> <script> document.write(cars[0]); </script> </h6> </div> <div class="col-md-1"> <h5 class="text-secondary">MODELO </h5> <h6> <script> document.write(cars[1]); </script> </h6> </div> <div class="col-md-1"> <h5 class="text-secondary">COR</h5> <h6> <script> document.write(cars[2]); </script> </h6> </div> <div class="col-md-1,7"> <h5 class="text-secondary">FABRICANTE</h5> <h6> <script> document.write(cars[3]); </script> </h6> </div> <div class="col-md-2"> <h5 class="text-secondary">ANO DE FABRICAÇÃO</h5> <h6> <script> document.write(cars[4]); </script> </h6> </div> <div class="col-md-2"> <h5 class="text-secondary">AR CONDICIONADO</h5> <h6> <script> document.write(cars[5]); </script> </h6> </div> <div class="col-md-1"> <h5 class="text-secondary">VALOR</h5> <h6> <script> document.write(cars[6]); </script> </h6> </div> <div class="col-md-1"> <h5 class="text-secondary">IPVA</h5> <h6> <script> document.write(cars[7]); </script> </h6> </div> <div class="row mb-1"> <div class="col-md-12"> <h5 class="text-secondary">LOCALIZAÇÃO DO CARRO</h5> <h6> <script> document.write(cars[8]); </script> </h6> </div> </div> </div> </div> </div> </div> </div> </div> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>Formulário</legend> <!-- Search input--> <div class="form-group"> <label class="col-md-4 control-label" for="searchinput">Fabricante</label> <div class="col-md-4"> <input id="searchinput" name="searchinput" type="search" placeholder="Fabricante" class="form-control input-md" required=""> </div> </div> <!-- Search input--> <div class="form-group"> <label class="col-md-4 control-label" for="searchinput">Modelo</label> <div class="col-md-4"> <input id="searchinput" name="searchinput" type="search" placeholder="Modelo" class="form-control input-md" required=""> </div> </div> <!-- Select Multiple --> <div class="form-group"> <label class="col-md-4 control-label" for="Ano de Fabricação">Ano de Fabricação</label> <div class="col-md-4"> <select id="Ano de Fabricação" name="Ano de Fabricação" class="form-control" multiple="multiple"> <option value="1">2020</option> <option value="2">2019</option> <option value="3">2018</option> <option value="4">2017</option> <option value="5">2016</option> <option value="6">2015</option> <option value="">2014</option> </select> </div> </div> <!-- Select Multiple --> <div class="form-group"> <label class="col-md-4 control-label" for="Localização do Carro">Localização do Carro</label> <div class="col-md-4"> <select id="Localização do Carro" name="Localização do Carro" class="form-control" multiple="multiple"> <option value="1">Belo Horizonte</option> <option value="2">Contagem</option> <option value="3">Betim</option> <option value="4">Venda Nova</option> </select> </div> </div> <!-- Select Multiple --> <div class="form-group"> <label class="col-md-4 control-label" for="Cor">Cor</label> <div class="col-md-4"> <select id="Cor" name="Cor" class="form-control" multiple="multiple"> <option value="1">Preto</option> <option value="2">Prata</option> <option value="3">Branco</option> <option value="4">Vermelho</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="Ar Condicionado">Ar Condicionado</label> <div class="col-md-4"> <select id="Ar Condicionado" name="Ar Condicionado" class="form-control"> <option value="1">Sim</option> <option value="2">Não</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="IPVA">IPVA</label> <div class="col-md-4"> <select id="IPVA" name="IPVA" class="form-control"> <option value="1">Pago</option> <option value="2">A pagar</option> </select> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="Preço">Preço</label> <div class="col-md-4"> <input id="Preço" name="Preço" type="text" placeholder="Preço" class="form-control input-md" required=""> </div> </div> <input class="btn btn-primary" type="submit" value="Submit"> </fieldset> </form> </body> </html>
<style type="text/css"> img {width:100%;} h5 {font-size:16px;} body {background:#f2f2f2;} </style>
var cars = ["HYUNDAI", "HB20", "Preto","hyunday","2020","Ar condicionado","R$55mil","Pago","BH"]; //car[0] //car[1] var empresa var comprador

Related: See More

Vue Argon Design System

Questions / Comments: