"cristina-exercicio3"
Bootstrap 4.1.1 Snippet by psd06t

<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 ----------> <link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/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 ----------> <div class="container"> <div class="row"> <div class="col-md-12"> <h1>YOURBRAND a loja de carros mais incrivel</h1> <p> Você de carro novo sempre. Financie seu veículo pelo Ciclo <strong>CSCS</strong> e fique tranquilo com parcelas fixas que cabem no seu bolso e recompra garantida. </p> <img src="https://static.vecteezy.com/system/resources/previews/000/590/514/non_2x/automotive-car-logo-design-vector.jpg" alt="lodo da fabrica" style=" width: 200px; padding: 5px;"> </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"> <div class="row mb-2"> <div class="col-md-8"> <div class="card"> <div class="card-body"> <div class="row"> <div class="col-md-12"> <h4 class="text-danger">Overview</h4> <hr> </div> </div> <div class="row mb-4"> <div class="col-md-3"> <h5 class="text-secondary">MARCA</h5> <h6> <script> document.write(cars[0]) </script> </h6> </div> <div class="col-md-3"> <h5 class="text-secondary">Modelo</h5> <h6> <script> document.write(cars[1]); </script> </h6> </div> <div class="col-md-3"> <h5 class="text-secondary">cor</h5> <h6> <script> document.write(cars[2]); </script> </h6> </div> <div class="col-md-3"> <h5 class="text-secondary">Direção</h5> <h6> <script> document.write(cars[3]); </script> </h6> </div> </div> <div class="row mb-4"> <div class="col-md-3"> <h5 class="text-secondary">Ano de fabricação</h5> <h6> <script> document.write(cars[4]); </script> </h6> </div> <div class="col-md-3"> <h5 class="text-secondary">Ar condicionado</h5> <h6> <script> document.write(cars[5]); </script> </div> <div class="col-md-3"> <h5 class="text-secondary">Combustivel</h5> <h6> <script> document.write(cars[6]); </script> </h6> </div> <div class="col-md-3"> <h5 class="text-secondary">IPVA</h5> <h6> <script> document.write(cars[7]); </script> </h6> </div> </div> <div class="row mb-4"> <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 > </div> </div> </div> </div> </div> <div> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>DADOS DA EMPRESA</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="empresa">Nome da empresa</label> <div class="col-md-6"> <input id="empresa" name="empresa" type="text" placeholder="Digite o nome da empresa" class="form-control input-md" required=""> <span class="help-block">Nome da empresa</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="empresa">Endereço da empresa</label> <div class="col-md-8"> <input id="empresa" name="empresa" type="text" placeholder="Rua, numero, bairro ,cidade" class="form-control input-md" required=""> <span class="help-block">Endereço completo da emprea</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="empresa">CNPJ</label> <div class="col-md-5"> <input id="empresa" name="empresa" type="text" placeholder="Digite o CNPJ da empresa" class="form-control input-md" required=""> <span class="help-block">CNPJ</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="empresa">Telefone da empresa</label> <div class="col-md-4"> <input id="empresa" name="empresa" type="text" placeholder="(XX) XXXX-XXXX" class="form-control input-md" required=""> <span class="help-block">Telefone</span> </div> </div> </fieldset> </form> </div> <div> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>DADOS DO CLIENTE</legend> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="cliente">Nome do cliente</label> <div class="col-md-6"> <input id="cliente" name="cliente" type="text" placeholder="Digite o nome do cliente" class="form-control input-md" required=""> <span class="help-block">Nome do cliente</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="cliente">Endereço do cliente</label> <div class="col-md-8"> <input id="cliente" name="cliente" type="text" placeholder="Rua, numero, bairro ,cidade" class="form-control input-md" required=""> <span class="help-block">Endereço completo do cliente</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="cliente">CPF/CNPJ</label> <div class="col-md-5"> <input id="cliente" name="cliente" type="text" placeholder="Digite o CPF/CNPJ do cliente" class="form-control input-md" required=""> <span class="help-block">CPF/CNPJ</span> </div> </div> <!-- Text input--> <div class="form-group"> <label class="col-md-4 control-label" for="cliente">Telefone do cliente</label> <div class="col-md-4"> <input id="cliente" name="cliente" type="text" placeholder="(XX) XXXX-XXXX" class="form-control input-md" required=""> <span class="help-block">Telefone</span> </div> </div> </fieldset> </form> </div> <div> <form class="form-horizontal"> <fieldset> <!-- Form Name --> <legend>DADOS DO VEICULO</legend> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="selectbasic">Marcas</label> <div class="col-md-5"> <select id="selectbasic" name="selectbasic" class="form-control"> <option value="1FIAT">FIAT</option> <option value="TOYOTA">TOYOTA</option> <option value="BMW">BMW</option> <option value="CHEVROLET">CHEVROLET</option> <option value="JEEP">JEEP</option> <option value="NISSAN">NISSAN</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Modelos</label> <div class="col-md-5"> <select id="fabricante" name="fabricante" class="form-control"> <option value="1TOURO">TOURO</option> <option value="COROLA">COROLA</option> <option value="BMWI8">BMWI8</option> <option value="ONIX">ONIX</option> <option value="JEEP">JEEP</option> <option value="FRONTIER">FRONTIER</option> </select> </div> </div> <!-- Select Multiple --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Cor</label> <div class="col-md-5"> <select id="fabricante" name="fabricante" class="form-control" multiple="multiple"> <option value="1">Preto</option> <option value="2">Prata</option> <option value="">Branco</option> <option value="">Vermelho</option> </select> </div> </div> <!-- Prepended text--> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Direção</label> <div class="col-md-5"> <div class="input-group"> <span class="input-group-addon">Digite o tipo de direção</span> <input id="fabricante" name="fabricante" class="form-control" placeholder="Digite a direção" type="text" required=""> </div> <p class="help-block">entre com a direção</p> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Ano de fabricação</label> <div class="col-md-4"> <select id="fabricante" name="fabricante" class="form-control"> <option value="2020">2020</option> <option value="2019">2019</option> <option value="2018">2018</option> <option value="2017">2017</option> <option value="2016">2016</option> <option value="2015">2015</option> <option value="2014">2014</option> <option value="2013">2013</option> <option value="2012">2012</option> <option value="2011">2011</option> <option value="2010">2010</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Ar condicionado</label> <div class="col-md-4"> <select id="fabricante" name="fabricante" class="form-control"> <option value="sim">sim</option> <option value="não">não</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Combustivel</label> <div class="col-md-4"> <select id="fabricante" name="fabricante" class="form-control"> <option value="Gasolina">Gasolina</option> <option value="Etanol">Etanol</option> <option value="Diesel">Diesel</option> <option value="Flexão">Flex</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">IPVA</label> <div class="col-md-4"> <select id="fabricante" name="fabricante" class="form-control"> <option value="Pago">Pago</option> <option value="À pagar">À pagar</option> </select> </div> </div> <!-- Select Basic --> <div class="form-group"> <label class="col-md-4 control-label" for="fabricante">Localização</label> <div class="col-md-4"> <select id="fabricante" name="fabricante" class="form-control"> <option value="Belo Horizonte">Belo Horizonte</option> <option value="Betim">Betim</option> <option value="Contagem">Contagem</option> </select> </div> </div> </fieldset> </form> </div>
img {width:100%;} h5 {font-size:16px;} body {background:#f2f2f2;}
var cars = ["FIAT", "Touro", "Prata", "automatico","2020","sim","Flex","Pago","BH"]; //cars[0] var empresa=["nome","endereco","cnpj","telefone"] // empresa[0] var cliente=["nome","endereco","cnpj","telefone"] // cliente[0]

Related: See More


Questions / Comments: