我正在研究Bootstrap主题。我有一个产品页面,其中有“左右”块div。当屏幕调整大小时,尝试将右块div推到左块上方。请参阅我已完成以下代码更新和更改,但是我没有得到实际结果。
原始:Check the actual website here
<div class="col-main col-sm-9">
LEFT BLOCK
</div>
<div class="col-right sidebar col-sm-3">
RIGHT BLOCK
</div>
更新:
<div class="col-main col-sm-9 col-sm-push-3 col-md-push-0">
LEFT BLOCK
</div>
<div class="col-right sidebar col-sm-3 col-sm-pull-9 col-md-pull-0">
RIGHT BLOCK
</div>
响应时,我对小型设备的期望是什么:
<div class="col-right sidebar col-sm-3 col-sm-pull-9 col-md-pull-0">
RIGHT BLOCK
</div>
<div class="col-main col-sm-9 col-sm-push-3 col-md-push-0">
LEFT BLOCK
</div>
有人知道为什么在调整屏幕大小时,Right块不会堆叠在Left Div上方吗?该主题使用Bootstrap 3+。列排序应该在Bootstrap中起作用吗?
谢谢,需要一些输入,我仍在尝试CSS。
最佳答案
请查看以下sample:
<div class="container">
<div class="row">
<div class="col-xs-4">Menu</div>
<div class="col-xs-8">
<div class="row">
<div class="col-md-4 col-md-push-8">Right Content</div>
<div class="col-md-8 col-md-pull-4">Content</div>
</div>
</div>
关于css - bootstrap 未发生-在响应较小的设备上将Right block Div推到Left Block上方,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/36758887/