Javascript estou criando um portifolio e não estou conseguindo alinhar o js !

edupessoa1 · 20 de setembro de 2021

<!doctype html>

<html lang="pt-BR">

  <head>

    <!-- Required meta tags -->

    <meta charset="utf-8">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="preconnect" href="https://fonts.googleapis.com">

    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap" rel="stylesheet">

    <!-- Bootstrap CSS -->

   <link rel="stylesheet" href="css/main.css">

   

   <title>Santos web-designer</title>

  </head>

  <body >

    <!---header--->



    <header  id="navbar_top">

        

     

       

      <nav class="menu-bg navbar navbar-expand-lg pt-0 pb-0 navbar-light ">

       <div class="container">

          <a class="navbar-brand" href="#"> <img src="assets/img/logo nova01 (3).png"

            class="img-fluid"></a>

        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#main_nav">

            <span class="navbar-toggler-icon"></span>

          </button>

        <div class="collapse navbar-collapse " id="main_nav">

        <ul class="navbar-nav ms-auto">

          <li class="nav-item"><a class="nav-link" href="#slider"> HOME </a></li>

          <li class="nav-item"><a class="nav-link" href="#sobre"> CONTATO </a></li>

          <li class="nav-item"><a class="nav-link" href="#cursos"> PLANOS </a></li>

          <li class="nav-item"><a class="nav-link" href="#contato"> GALERIA </a></li>

     

          

        </ul>

        </div> <!-- navbar-collapse.// -->

       </div> <!-- container-fluid.// -->

      </nav>

      </header>



<!---//header---> 



<div class="menu-spacing"></div>



<!---slider---> 



<div id="slider" class="block">

  <div class="container pt-5 main-bg ">

    <div class="row">

      <div class="col-md-4 align-self-center">

        <h1>desenvolvimento front-end</h1>

        <h4 class="mb-4">Desenvolvemos seu site, e deixamos ele online!</h4>

        <a href="#" class="btn btn-primary button button-primary d-md-inline-block d-block ">Eu quero!</a>

        <a href="#" type="button" class="btn btn-outline-primary  button-primary-outline button d-md-inline-block d-block">Saiba mais</a>

      </div>

      <div class="col-md-8 align-self-center text-center">

        <img src="assets/img/undraw_static_website_0107.svg" class="img-fluid"></div>



    </div>

  </div>

</div>



<!---//slider---> 



<!---sobre---> 



<div id="sobre" class="block">

  <div class="container">

    <div class="row">

      <div class="col-md-6 text-center align-self-center order-md-1 order-2">

        <img src="/assets/img/cor nova.svg" class="img-fluid"></div>

        

        <div class="col-md-6 text-center align-self-center mb-md-4 mb-4 order-md-2 order-1">

         

          <h2 class="title">Desenvolvemos seu projeto do zero!</h2>

          

          <h4 class="subtitle"> Comunicação não é só falar, ver ou ouvir, é fazer entender!</h4>

       

          <p>Não vendemos apenas sites, vendemos resultados se você quer ser encontrado

            de maneira eficiente, invista em Sites, Deixamos sua marca visível na internet.

            

             </p>

             <a href="#" class="btn btn-primary button button-primary">ENTRE EM CONTATO</a>

        </div>



    </div>

  </div>

</div>





<!---//sobre---> 



<!---cursos--->

<div id="cursos" class="block">

  <div class="container">

    <h2 class="title text-center">Nossos PLANOS</h2>

    

    <div class="row">

      <div class="col-lg-3 col-md-6 mb-4 lg-0">

        <a href="#" class="destaque">

          <div class="img-container mb-3">

           <img src="/assets/img/analises-clinicas-1.jpg" class="img-fluid">

          </div>



          <h5 class="text-uppercase">Basico</h5>

          <p class="mb-0">Analista clínico é aquele que atua e auxilia nos exames laboratoriais necessários para os diagnósticos em diversas áreas. O técnico em análises clínicas poderá atuar em laboratórios, hospitais, clínicas e postos de saúde.</p>



        </a>

      </div>

      <div class="col-lg-3 col-md-6 mb-4 lg-0">

        <a href="#" class="destaque">

          <div class="img-container mb-3">

           <img src="/assets/img/enf-2.jpg" class="img-fluid">

          </div>



          <h5 class="text-uppercase">médio</h5>

          <p class="mb-0">O técnico em enfermagem irá atuar nos demais processos de saúde que colaborem com a prevenção e recuperação do paciente, promovendo ações preparatórias de exames e consultas dentro do que foi aprendido no seu ensino técnico.</p>



        </a>

      </div>

      <div class="col-lg-3 col-md-6 mb-4 lg-0">

        <a href="#" class="destaque">

          <div class="img-container mb-3">

           <img src="/assets/img/rad-3.jpg" class="img-fluid">

          </div>



          <h5 class="text-uppercase">avançado</h5>

          <p class="mb-0">Atuando como uma especialidade médica, o técnico em radiologia é o profissional responsável pelos serviços de diagnóstico por imagem em hospitais e clínicas radiológicas sob a supervisão de um Médico Radiologista.</p>



        </a>

      </div>

      <div class="col-lg-3 col-md-6 mb-4 lg-0">

        <a href="#" class="destaque">

          <div class="img-container mb-3">

           <img src="/assets/img/adm-4.png" class="img-fluid">

          </div>



          <h5 class="text-uppercase">enterprise</h5>

          <p class="mb-0">O curso técnico em administração é responsável em capacitar profissionais a exercerem funções de apoio dentro da gestão empresarial, sempre com muita criatividade e percepção de empreendedorismo.</p>



        </a>

      </div>

      

    </div>



  </div>

</div>

    



<!---//cursos--->




<!---contato--->

<h1 class="title text-center">CONTATO</h1>



<div id="contato" class="block">

  <div class="container">

    <div class="row">

      <div class=" contato-forms col-md-6 align-self-center"><form class="row g-3">

        <div class="col-md-6">

          <label for="fname" class="form-label">NOME</label>

          <input type="email" class=" form-control" id="fname" placeholder="Seu nome aqui">

        </div>

        <div class="col-12">

          <label for="inputEmail4" class="form-label">Email</label>

          <input type="text " class="form-control" id="inputEmail4" placeholder="[email protected]">

        </div>

        <div class="col-12">

          <label for="inputAddress" class="form-label">NUMERO</label>

          <input type="text" class="form-control" id="inputAddress" placeholder="(81)999999999">

        </div>

        </select>

       

        

        <div class="form-floating col-12">

          <textarea class="form-control" placeholder="Leave a comment here" id="floatingTextarea2" style="height: 100px"></textarea>

          <label for="floatingTextarea2">entre em contato .</label>

        </div>

        

        <div class="col-12">

          <button type="submit" class="button-primary btn btn-primary">Cadastrar</button>

        </div>

      </form></div>

    





<!---//contato--->



<!---galeria--->



      



<!---//galeria--->





  <!-- Option 2: Separate Popper and Bootstrap JS -->

    <script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-W8fXfP3gkOKtndU4JGtKDvXbO53Wy8SZCQHczT5FMiiqmQfUpWbYdTil/SxwZgAN" crossorigin="anonymous"></script>

    <!-- Option 1: Bootstrap Bundle with Popper -->

    <script src="js/bootstrap.bundle.min.js" integrity="sha384-/bQdsTh/da6pkI1MST/rWKFNjaCP5gBSY4sEBT38Q/9RBh9AH40zEOg7Hlq2THRZ" crossorigin="anonymous"></script>

    <script src='js/main.js'></script> 

   

    

   

   

  </body>

</html>

document.addEventListener("DOMContentLoaded", function(){

  window.addEventListener('scroll', function() {

      if (window.scrollY > 60) {

        document.getElementById('navbar_top').classList.add('fixed-top');

        // add padding top to show content behind navbar

        navbar_height = document.querySelector('.navbar').offsetHeight;

        document.body.style.paddingTop = navbar_height + 'px';

      } else {

        document.getElementById('navbar_top').classList.remove('fixed-top');

         // remove padding top from body

        document.body.style.paddingTop = '0';

      } 

  });

});

Entrar

Javascript estou criando um portifolio e não estou conseguindo alinhar o js !

Posts recomendados

edupessoa1

Link para o comentário

Compartilhar em outros sites

Crie uma conta ou entre para comentar

Criar uma conta

Entrar

Quem está navegando aqui 0 usuários estão online

Últimos tópicos

Livros

Cursos

Conteúdo recente

Sobre o Clube do Hardware

Direitos autorais

Mais

Fórum

Atividades

Artigos

Análises

Livros

Cursos