Bootstrap元素容器类导致另一个Bootstrap元素发生更改

Question

我有一个页脚，还有一个页面内容的容器。但是内容"；容器"；由于某种原因，div中的类也会导致页脚应用于该容器中。这是代码：

HTML:

<section id="products" class="products py-5">
<div class="container">
<!--Section Title-->
<div class="row">
<div class="col-10 mx-auto col-sm-6 text-center">
<h1 class="text-capitalize product-title" id="promosyonHeader">
Promosyon Ürünlerimiz
</h1>
</div>
</div>
</div>

页脚HTML:

<!--Footer-->
<footer class="footer mt-5">
<div class="text-center py-5 border-top border-secondary">
<h2 class="py-1">Doğuhan Tanıtım</h2>
<div class="mx-auto heading-line"></div>
</div>
<div class="container">
<div class="container">
<div id="footer" class="row mb-0">
<div class="col-lg-8 offset-lg-2 text-center">
<p>İskitler/Ankara</p>
<p>number</p>
<p>com.tr</p>
<div class="justify-content-center">
<i class="fab fa-facebook fa-2x"></i>
<i class="fab fa-twitter fa-2x"></i>
<i class="fab fa-instagram fa-2x"></i>
</div>
</div>
</div>
<!--<div class="copyright text-center py-3 border-top text-light" id="tm"><p>Tanıtım &trade;</p></div>-->
</div>
</div>

Answer 1

试试这个：

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section id="products" class="products py-5">
<div class="container">
<!--Section Title-->
<div class="row">
<div class="col-10 mx-auto col-sm-6 text-center">
<h1 class="text-capitalize product-title" id="promosyonHeader">
Promosyon Ürünlerimiz
</h1>
</div>
</div>
</div>
</section>

<footer class="footer mt-5">
<div class="text-center py-5 border-top border-secondary">
<h2 class="py-1">Doğuhan Tanıtım</h2>
<div class="mx-auto heading-line"></div>
</div>
<div class="container">
<div class="container">
<div id="footer" class="row mb-0">
<div class="col-lg-8 offset-lg-2 text-center">
<p>İskitler/Ankara</p>
<p>number</p>
<p>com.tr</p>
<div class="justify-content-center">
<i class="fab fa-facebook fa-2x"></i>
<i class="fab fa-twitter fa-2x"></i>
<i class="fab fa-instagram fa-2x"></i>
</div>
</div>
</div>
</div>
</div>
</footer>

我认为你的引导程序版本有问题。或者你忘了关闭一些标签