Bootstrap 5 JS çalışmıyor

Alifg

Hectopat
Katılım
1 Haziran 2021
Mesajlar
80
Daha fazla  
Cinsiyet
Erkek
HTML: 
<html>
    <head>
      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
     <link rel="stylesheet" href="css.css">
    </head>
    <nav class="navbar navbar-expand-lg navbar-light  text-center header">
        <a class="navbar-brand" href="#">
            <img src="logo2.png" class="img-fluid logo" alt="">
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon">

          </span>
        </button>
     
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mx-auto">
            <li class="nav-item active me-5">
              <a class="nav-link" href="#">Hakkımızda</span></a>
            </li>
            <li class="nav-item me-5">
              <a class="nav-link" href="#">İletişim</a>
            </li>
            <li class="nav-item me-5">
                <a class="nav-link" href="#">Ürünler</a>
              </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                İçerikler
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                <a class="dropdown-item" href="#">Action</a>
                <a class="dropdown-item" href="#">Another action</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">Something else here</a>
              </div>
            </li>
           
          </ul>
          <form class="form-inline my-2 my-lg-0">
            <input class="form-control mr-sm-2" type="search" placeholder="Arama" aria-label="Search">
            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Arama</button>
          </form>
        </div>
      </nav>
      <div class="container-fluid">
       
      </div>
      <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
      <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" integrity="sha384-IQsoLXl5PILFhosVNubq5LC7Qb9DXgDA9i+tQ8Zj3iwWAwPtgFTxbJ8NT4GN1R8p" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.min.js" integrity="sha384-cVKIPhGWiC2Al4u+LWgxfKTRIcfu0JTxR+EQDz/bgldoEyl4H0zUF0QKbrJ0EcQF" crossorigin="anonymous"></script>

       
        </body>
</html>
 
Son düzenleyen: Moderatör:
Head kısmına eklenecek:
HTML: 
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
Body en alt eklenecek:
Kod: 
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>

NOT: En alttaki 3 scripti silip dediğim gibi ekle.
 

JS gene de çalışmıyor.
 
Kullandığın html dosyasını chromeda aç ve f12 ile geliştirici konsolunu aç. Menüden Console'a gel. Ordaki hata çıktısını buraya at.
 
delikarga dedi:
Kullandığın html dosyasını chromeda aç ve f12 ile geliştirici konsolunu aç. Menüden Console'a gel. Ordaki hata çıktısını buraya at.
Genişletmek için tıkla...
birde gönderdiğin şekilde yaptığımda kendi css dosyam da çalışmayı bırakıyor sebebi nedir
 
delikarga dedi:
Kendi cssini bootstrapin altına koy. Bu arada senin daha önce ekledğini sil, 2 tane olmasın bootstrap.css
Genişletmek için tıkla...
HTML: 
<html>
    <head>
    <body>
    </head>
    <nav class="navbar navbar-expand-lg navbar-light  text-center header">
        <a class="navbar-brand" href="#">
            <img src="logo2.png" class="img-fluid logo" alt="">
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon">

          </span>
        </button>
      
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
          <ul class="navbar-nav mx-auto">
            <li class="nav-item active me-5">
              <a class="nav-link" href="#">Hakkımızda</span></a>
            </li>
            <li class="nav-item me-5">
              <a class="nav-link" href="#">İletişim</a>
            </li>
            <li class="nav-item me-5">
                <a class="nav-link" href="#">Ürünler</a>
              </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                İçerikler
              </a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdown">
                <a class="dropdown-item" href="#">Action</a>
                <a class="dropdown-item" href="#">Another action</a>
                <div class="dropdown-divider"></div>
                <a class="dropdown-item" href="#">Something else here</a>
              </div>
            </li>
            
          </ul>
          <form class="form-inline my-2 my-lg-0">
            <input class="form-control mr-sm-2" type="search" placeholder="Arama" aria-label="Search">
            <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Arama</button>
          </form>
        </div>
      </nav>
      <div class="container">
      <main>
        <div class="p-4 bg-dark text-white mb-5">
          <div class="p-4 col-md-6">
            <h1>başlık</h1>
            Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quas voluptatibus suscipit commodi rem a eaque repudiandae aspernatur optio aut, deserunt consequatur quidem quibusdam? Totam, sunt impedit nobis minus eos est. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolores, dolore ratione. Eum, id commodi molestias fugiat necessitatibus ea nulla explicabo, voluptatibus, cum libero tempora? Soluta tempore cum optio maxime ullam?
            <img src="logo2.png" height="200px" alt="">
            
          </div>

        </div>
      </div>
      </main>
      
      <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-9ndCyUaIbzAi2FUVXJi0CjmCapSmO7SnpJef0486qhLnuZ2cdeRhO02iuK6FUUVM" crossorigin="anonymous">
        </body>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-geWF76RCwLtnZ8qwWowPQNguL3RmwHVBC9FhGdlKrxdiJJigb/j/68SIy3Te4Bkz" crossorigin="anonymous"></script>

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

        
</html>


CSS normal şu an bir sorun yok ama JS hala çalışmıyor yanlış bir şey mi yaptım?
 
Konuyu cevapla
Menü
Giriş yap
Kaydol
Bu siteyi kullanmak için çerezler gereklidir. Siteyi kullanmaya devam etmek için çerezleri kabul etmelisiniz. Daha Fazlasını Öğren.…