我不明白为什么我的网格系统未按预期显示。
HTML代码:
<header class="navbar navbar-dark navbar-expand bd-navbar bg-dark p-0 shadow">
<div class="col-sm-12 col-md-12 col-lg-12">
<div class="col-sm-12 col-md-12 col-lg-3 text-sm-center text-md-center text-lg-left">
<a class="navbar-brand"><!-- img src is django code, ignore it-->
<img src="{% static 'images/logo.jpg' %}" class="rounded-circle" style="height:30px;width:30px;">
<label style="font-family: 'Oswald', 'DejaVu Sans Mono' !important; color:white;">Title</label>
</a>
</div>
<div class="col-sm-12 col-md-12 col-lg-9 text-sm-center text-md-center text-lg-left">
<!--my form here-->
</div>
</div>
</header>
重要的是这里的lg
引申。您可以看到我的div
具有12个列,其中有两个div
,一个具有3个列,另一个具有9个列(因此它们的总和为12)。期望看到它们,如Grid system - Bootstrap中所述。但是我得到的结果是...
为什么?谢谢!
您的col div应该放在行div内。也许这可以解决您的问题!