到目前為止，感謝大家提供的精彩資源。過去幾天一直在努力解決這個問題。
Bootstrap 似乎在某些地方有效，但在其他地方無效。
https://tellus.llc
基本功能似乎就在那里。我可以添加許多特定于引導程式的元素（行、列、導航欄、回應式文本和影像），但小東西似乎沒有按預期作業。
我的導航欄不會在中等或小螢屏上展開或折疊（直接從 boostrap 的網站復制/粘貼未修改的代碼在我的檔案中也不起作用。JavaScript / 依賴問題？）。
<nav class="navbar fixed-top navbar-expand-md bg-light navbar-light" role="navigation"> <div class="container-fluid"> <a class="navbar-brand" href="#top"> <img class="nav-img" src="assets/images/TellusLogo.png"/> </a> <button style="margin-right:3vw;" class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navCollapse" > <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navCollapse"> <ul class="navbar-nav"> <li class="nav-item active"> <a class="nav-link" href="#partners">Partners</a> </li> <li class="nav-item"> <a class="nav-link" href="#training">Training</a> </li> <li class="nav-item"> <a class="nav-link" href="#software">Software</a> </li> <li class="nav-item"> <a class="nav-link" href="#concept">Concept</a> </li> <li class="nav-item"> <a class="nav-link" href="#service">Service</a> </li> <li class="nav-item"> <a class="nav-link" href="#rescue">Rescue</a> </li> <li class="nav-item"> <a class="nav-link" href="#contact">Contact</a> </li> </ul> </div> </div> </nav>我無法為元素添加間距或間隙。添加 p-1 或 pt-4 類不會產生填充。
有些 div 會忽略分配給它們的列間距（col-sm-4 不會折疊，看起來像 col-sm-12）。“vertical-align”是一個自定義類，flex 容器。出于某種原因，bootstrap 的網格在這里也讓我感到悲傷，但它添加了 flexbox。
<article class="container spacer-4"> <div class="row"> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/canary-labs.png" /> </div> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/codesys.png" /> </div> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/hannah-instruments.jpg" /> </div> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/inductive-automation-logo.png" /> </div> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/ssh.png" /> </div> <div class="col-lg-2 col-md-4 col-sm-4 vertical-align"> <img class="img-fluid" src="../assets/images/partners/onlogic.png" /> </div> </div> </article>
我最好的猜測是 jquery 或其他一些 JS 依賴項，但我已經嘗試了每個腳本的多個版本，但沒有結果。
這也可能是我的嵌套問題。
我通過 github -> google 域托管，但問題出現在我的本地開發服務器上。
我認為所有資訊都在那里，但我很樂意分享任何其他有用的資訊。再次感謝你！
uj5u.com熱心網友回復：
根據您使用的引導程式版本，即5.0，對于導航欄，您必須更改data-toggle并data-target使用data-bs-toggle和data-bs-target。
引導導航欄
您的網格作業正常，直到小螢屏。但你必須改變
<div class="col-lg-2 col-md-4 col-sm-4 vertical-align">
和
<div class="col-lg-2 col-md-4 col-sm-4 col-4 vertical-align">
為所有螢屏作業回應。
引導網格
uj5u.com熱心網友回復：
要解決 bootstrap 5 中的 Navbar-collapse 問題，您應該使用“ data-bs ”您的導航欄切換器具有 bootstrap 5 未使用的資料目標和資料切換，請使用data-bs-toggle和data-bs -target代替
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/341052.html