在本节中，有些图像会从其各个部分中移出，而该部分的背景是未正确显示的图像。
<header class=" container-fluid">
<!--<div class="clearfix"></div>-->
<div class="container inr-header">
<div class="header-top container">
<div class="logo">
<a href="#"><img src="images/logo.jpg" alt=""></a>
</div>
<nav class="top-nav">
<a href="#" class="nav-tabs">Home</a>
<a href="#" class="nav-tabs">HOW MOGO STACKS</a>
<a href="#" class="nav-tabs">PRICING</a>
<a href="#" class="nav-tabs">BLOG</a>
<a href="#" class="nav-tabs">EVENTS</a>
<a href="#" class="nav-tabs">SUPPORT</a>
<a href="#" class="nav-tabs">CONTACT</a>
</nav>
</div>
<div class="slider ">
<div class="slider-left ">
<h2>The Mobile First <span>CRM Platform</span></h2>
<p> MOGO CRM is a mobile first CRM platform that gives complete CRM functionality such as Sales, Service, Time Management, Purchase Requisitions etc. to users on their mobile devices. Connect your choice of smartphones with any backend system
</p>
<div class="brands">
<img src="images/G-Play-Store.png">
<img src="images/i-Store.png">
</div>
<div class="slider-btns">
<a href="#" class="slider-btn btn-default SignUp">SIGN UP</a>
<a href="#" class="slider-btn btn-default Demo">DEMO</a>
</div>
</div>
<div class="slider-dots">
<a href="#"><img src="images/slider-circle.png" class="dots"></a>
<a href="#"><img src="images/slider-dots.png" class="dots"></a>
<a href="#"><img src="images/slider-dots.png" class="dots"></a>
<a href="#"><img src="images/slider-dots.png" class="dots"></a>
</div>
<div class="slider-right">
<img src="images/slider-image.png">
</div>
</div>
</div>
</header>
答案 0 :(得分：1)
您遇到的问题是因为您没有遵循bootstrap网格系统后面的标准。为了使网格正常工作，您必须在.row或.container之后使用.container-fluid。根据官方文档container s不能嵌套。使用.col-后，必须直接使用.row列类。所以始终有.container > .row > .col-*或.container-fluid > .row > .col-*序列。